点击#xx后url就会变成 域名+php+#xx
如何点击#xx后,URL保持不变,域名+php
遇到了同样的问题,还尝试过popstate弹出历史记录之类的,不行。查到了你的这个提问,现在解决了后回来加个回答,我最终解决方法是,不用a锚点,用Jquery。
【第一步】给文章中的h1-h5添加id
<h1 id="c0">一、教程内容</h1>
【第二步】把要跳转的位置id作为目录的name属性记录下来:
<a name="c0" class="cbtn article-ch1">一、教程内容</a>
【第三步】用JS或者Jquery实现跳转,Jquery可以写一些模拟滚动条之类的操作
JS:
document.getElementById($(this).attr('name')).scrollIntoView()
Jquery:
$(document).on('click', '.cbtn', function(e) {
$('html,body').animate({scrollTop: $("#" + this.name).offset().top}, 500);
});
完整的实现可以参考我的博客文章:《Jquery实现文章目录侧边栏导航》
<head>
<script type='text/javascript'>
jQuery(document).ready(function($) {
$(".scroll").click(function(event){
event.preventDefault();
$('html,body').animate({scrollTop:$(this.hash).offset().top}, 1200);
});
});
</script>
</head>
<body>
<a class="scroll" href="#codeword">Blue Words</a>
<div id="codeword"></div>
</body>
<a href="#xxx" onclick="return false">xxx</a>
<!-- 让DOM行为失效即可,如果还有更具体的逻辑,在事件中做相应的编码即可 -->