大家好我每个人通过ajax调用来调用页面加载特定的div。
<ul id="nav" class="nav" style="font-size:12px;">
<li><a href="#" id="m_blink" onclick="fun1()">tab1</a></li>
<li><a href="#" id="d_blink" onclick="fun2()">tab2</a></li>
<li><a href="#" id="k_blink" onclick="fun3()">tab3</a></li>
</ul>
<div id="home"></div>
这是我的Javascript脚本调用特定“home”div中的页面
<script type="text/javascript">
function fun1(){
$("#home").load("page1.php",{},function(){});
}
function fun2(){
$("#home").load("page2.php",{},function(){});
}
function fun3(){
$("#home").load("page3.php",{},function(){});
}
</script>
当我在“家庭”div中调用页面时:
在URl中:
当我点击tab1
时localhost/site/#
即使我点击了tab2
localhost/site/#
当我点击tab3
时localhost/site/#
我想删除网址上的#值,请建议我如何从网址中删除哈希值。
谢谢
答案 0 :(得分:1)
试试这个解决方案;)
<ul id="nav" class="nav" style="font-size:12px;">
<li><a href="#" id="m_blink">tab1</a></li>
<li><a href="#" id="d_blink">tab2</a></li>
<li><a href="#" id="k_blink">tab3</a></li>
</ul>
<div id="home"></div>
<script type="text/javascript">
$("#m_blink").click(function(event) {
event.preventDefault();
$("#home").load("page1.php", {}, function() {});
});
$("#d_blink").click(function(event) {
event.preventDefault();
$("#home").load("page2.php", {}, function() {});
});
$("#k_blink").click(function(event) {
event.preventDefault();
$("#home").load("page3.php", {}, function() {});
});
</script>
答案 1 :(得分:0)
点击处理程序应该返回false,这样如果JavaScript没有失败则不会链接
<script type="text/javascript">
function fun1(){
$("#home").load("page1.php",{},function(){});
return false;
}
function fun2(){
$("#home").load("page2.php",{},function(){});
return false;
}
function fun3(){
$("#home").load("page3.php",{},function(){});
return false;
}
</script>
答案 2 :(得分:0)
您可以将整个脚本重构为:
值得注意的是,将Javascript与HTML分开是个好主意,因此您没有调用内联点击事件。
$(document).ready(function() {
$("#nav a").on("click", function(e){
e.preventDefault();
var page = $(this).attr("href");
$("#home").load(page);
});
});
preventDefault();
函数将停止添加#,并发生默认链接事件 - 与返回false
相同。
HTML
我已将page1.php
个链接添加到href
- 因此,如果因任何原因禁用了Javascript,您仍然可以导航到该页面。
<ul id="nav" class="nav" style="font-size:12px;">
<li><a href="page1.php" id="m_blink">tab1</a></li>
<li><a href="page2.php" id="d_blink">tab2</a></li>
<li><a href="page3.php" id="k_blink">tab3</a></li>
</ul>