如何使用 JavaScript/jQuery 滚动到页面顶部？

小编典典

如何使用 JavaScript/jQuery 滚动到页面顶部？

all

有没有办法用 JavaScript/jQuery 控制浏览器滚动？

当我将页面向下滚动一半，然后触发重新加载时，我希望页面打包到顶部，但它却试图找到最后一个滚动位置。所以我这样做了：

$('document').ready(function() {
   $(window).scrollTop(0);
});

但没有运气。

编辑：

因此，当我在页面加载后给他们打电话时，您的两个答案都有效-
谢谢。但是，如果我只是在页面上进行刷新，看起来浏览器会在.ready事件发生后计算并滚动到它的旧滚动位置（我也测试了 body onload()
函数）。

所以接下来是，有没有办法阻止浏览器滚动到它过去的位置，或者在它完成它的事情之后重新滚动到顶部？

阅读 108

2022-07-27

共1个答案

小编典典

哇，这个问题我迟到了 9 年。干得好：

将此代码添加到您的 onload。

// This prevents the page from scrolling down to where it was previously.
if ('scrollRestoration' in history) {
    history.scrollRestoration = 'manual';
}
// This is needed if the user scrolls down during page load and you want to make sure the page is scrolled to the top once it's fully loaded. This has Cross-browser support.
window.scrollTo(0,0);

要在窗口加载时运行它，只需像这样包装它（假设您引用了JQuery）

$(function() {
  // put the code here
});

history.scrollRestoration 浏览器支持：

Chrome：支持（从 46 开始）

Firefox：支持（从 46 开始）

边缘：支持（从 79 开始）

IE： _ 不支持_

Opera：支持（33 起）

Safari：支持

对于 IE ，如果你想在它自动向下滚动之后重新滚动到顶部，那么这对我有用：

var isIE11 = !!window.MSInputMethodContext && !!document.documentMode;
if(isIE11) {
    setTimeout(function(){ window.scrollTo(0, 0); }, 300);  // adjust time according to your page. The better solution would be to possibly tie into some event and trigger once the autoscrolling goes to the top.
}

2022-07-27