我需要使用通过页面滚动anchor tag 。
现在我做：
<a href="#div1">Link1</a>
<div id='div1'>link1 points me!!</div>
当我点击链接1，页面滚动到ID为“DIV1”的DIV这工作得很好。
问题的关键是，我不想改变我的URL这需要#div作为后缀，一旦我点击了Link1 。
我试着用锚HREF为
void(0);
和
location.hash='#div1';
return false;
e.preventdefault;
如何避免更改URL？
以使用jQuery的动画从杰夫·海因斯这样的回答：
function goToByScroll(id){
$('html,body').animate({scrollTop: $("#"+id).offset().top},'slow');
}
如果你正在使用jQuery不要忘了将库添加到您的项目。
编辑：此外，请确保您仍然“返回false;” 在该链接的点击处理程序，否则仍然会添加“＃DIV1”你的URL（感谢@niaccurshi）
scrollIntoView做了最好的工作，当所有其他方法失败！
document.getElementById('top').scrollIntoView(true);
凡'top'是你想要去的HTML标签的ID。
让你的生活更轻松，请尝试以下，让我知道，如果有别的;-)
<div>top</div>
<div style="height: 800px;"> </div>
<div><a href="javascript:void(0);" onclick="window.scroll(0,1);">click here</a></div>
FYI：你只需要玩弄一个/单线href="javascript:void(0);" onclick="window.scroll(0,1);" href="javascript:void(0);" onclick="window.scroll(0,1);" 并且它为你工作。
祝你有美好的一天！
riffing关闭henser的回答，我有其中window.location.hash已经设置的情况下，然后用户向后滚动到页面（其中散列链接）的顶部。
由于哈希已设置，您可以通过点击该链接重新定位：
$(window).scrollTop($('a[name='+id+']').offset().top);
只有这个代码添加到jQuery的文件上准备
参考： http://css-tricks.com/snippets/jquery/smooth-scrolling/
$(function() {
$('a[href*=#]:not([href=#])').click(function() {
if (location.pathname.replace(/^/ / , '') == this.pathname.replace(/^/ / , '') && location.hostname == this.hostname) {
var target = $(this.hash);
target = target.length ? target : $('[name=' + this.hash.slice(1) + ']');
if (target.length) {
$('html,body').animate({
scrollTop: target.offset().top
}, 1000);
return false;
}
}
});
});
我知道我4年晚，但你们可以试试这个。
HTML：
<a href="#div1">Link1</a>
<!-- you can put <br />'s here to see effect -->
<div id='div1'>link1 points me!!</div>
<!-- <br />'s here, too, to see effect -->
的JavaScript / jQuery的
$(document).ready(function(){
$('a').on('click', function(event) {
event.preventDefault();
var hash = this.hash;
$('html, body').animate({scrollTop: $(hash).offset().top}, 900);
});
})
平滑滚动任何项目点击包括锚，按钮等添加无添加的div id来网址:)
信息：scrollIntoViewOptions（ 可选）{行为： “自动” | “即时” | “平稳”，块：“开始” | “结束”， }
function scrollSmoothTo(elementId) { var element = document.getElementById(elementId); element.scrollIntoView({ block: 'start', behavior: 'smooth' }); } #userdiv { margin-top: 200px; width: 200px; height: 400px; border: 1px solid red; } <button onclick="scrollSmoothTo('userdiv')"> Scroll to userdiv </button> <div id="userdiv"> Lorem ipsum this is a random text </div> DEMO
参考： https://developer.mozilla.org/en/docs/Web/API/Element/scrollIntoView
