如果您转到页面 a 并四处滚动，则刷新页面将在您离开它的位置刷新。这很好，但是这也发生在 url 中有锚位置的页面上。一个例子是，如果你点击一个链接http://example.com/post/244#comment5并在环顾四周后刷新页面，你就不会在锚点处，页面会跳来跳去。有没有办法用javascript防止这种情况？因此，无论您做什么，您都将始终导航到锚点。
防止浏览器在刷新时自动滚动
IT技术
javascript
browser
2021-02-02 05:42:56
6个回答
在 Chrome 上，即使您将 scrollTop 强制为 0，它也会在第一个滚动事件之后跳转。
你应该将滚动绑定到这个：
$(window).on('beforeunload', function() {
$(window).scrollTop(0);
});
所以浏览器被欺骗相信它在刷新之前的开始。
经过多次失败，我终于成功了。anzo在这里是正确的，因为beforeunload当用户重新加载页面或单击链接时，使用将使页面跳转到顶部。这样unload做的明确方法也是如此。
$(window).on('unload', function() {
$(window).scrollTop(0);
});
Javascript 方式（感谢ProfNandaa）：
window.onunload = function(){ window.scrollTo(0,0); }
编辑：16/07/2015
即使有unload事件，Firefox 仍然存在跳转问题。
由于浏览器行为的变化，不再推荐此解决方案。查看其他答案。
基本上，如果使用锚点，我们将绑定到 windows 滚动事件。这个想法是第一个滚动事件必须属于浏览器完成的自动重新定位。发生这种情况时，我们会自行重新定位，然后移除绑定事件。这可以防止后续页面滚动使系统崩溃。
$(document).ready(function() {
if (window.location.hash) {
//bind to scroll function
$(document).scroll( function() {
var hash = window.location.hash
var hashName = hash.substring(1, hash.length);
var element;
//if element has this id then scroll to it
if ($(hash).length != 0) {
element = $(hash);
}
//catch cases of links that use anchor name
else if ($('a[name="' + hashName + '"]').length != 0)
{
//just use the first one in case there are multiples
element = $('a[name="' + hashName + '"]:first');
}
//if we have a target then go to it
if (element != undefined) {
window.scrollTo(0, element.position().top);
}
//unbind the scroll event
$(document).unbind("scroll");
});
}
});
这是一种更通用的方法。我没有试图阻止浏览器滚动（或像看起来那样跳到顶部），而是恢复页面上的先前位置。即，我正在 localStorage 中记录页面的当前 y 偏移，并在页面加载后滚动到该位置。
function storePagePosition() {
var page_y = window.pageYOffset;
localStorage.setItem("page_y", page_y);
}
window.addEventListener("scroll", storePagePosition);
var currentPageY;
try {
currentPageY = localStorage.getItem("page_y");
if (currentPageY === undefined) {
localStorage.setItem("page_y") = 0;
}
window.scrollTo( 0, currentPageY );
} catch (e) {
// no localStorage available
}