重新加载浏览器不会将页面重置为顶部答案

【问题标题】：Reload browser does not reset page to top重新加载浏览器不会将页面重置为顶部
【发布时间】：2012-07-14 18:59:45
【问题描述】：

我认为当您单击刷新时，浏览器应该将您的页面重置为顶部？我正在使用 js 手风琴，当我刷新时，它会关闭手风琴，但不会将页面重新定位到顶部。

http://imip.rvadv.com/index3.html

【问题讨论】：

跟Javascript无关，浏览器默认操作
Chrome 刷新后不会重置页面的滚动顶部。

标签： javascript jquery accordion jquery-ui-accordion

【解决方案1】：

好吧，正如你所看到的，它没有:)

但是你可以用一些简单的 jQuery 来强制它：

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

编辑：

似乎在 IE 9、FF 12 和 Chrome 20.0 中有效的唯一方法如下：

$(document).ready(function(){
    $('html').animate({scrollTop:0}, 1);
    $('body').animate({scrollTop:0}, 1);
});

奇怪的是，当我尝试直接滚动元素而不应用任何动画（即$('html').scrollTop(0)）时，它不起作用。由于持续时间设置为 1 毫秒，因此用户不会注意到任何内容。

如果有人能对此有所了解，我会很高兴 - 为什么滚动只适用于动画？

【讨论】：

在 IE9 中，我仍然看到它在跳跃。它跳到顶部，然后又跳回原来的位置。我很想看到一些更平滑的东西。滑到顶部会很好，因为这就是我的手风琴其余部分所做的。
在我看来，在 chrome 中，“自动滚动”发生在加载时，而不是“就绪”时。
甚至 onload，我必须将其添加到事件队列中以中断浏览器行为。您可以使用setTimeout(...,0) 将其添加到事件队列中。这也可能是您的 animate() 所做的。所以$(window).on('load',function() {setTimeout(function () { $('html,body').scrollTop(0) },0); });

【解决方案2】：

如果以上方法均无效，请尝试此操作。这会诱使浏览器认为它在刷新之前位于文档的顶部。

$(window).on('beforeunload', function() {
   $(window).scrollTop(0);
});

【讨论】：

【解决方案3】：

为了方便起见，浏览器将向下滚动到重新加载之前的位置。它只对过长的页面非常有用。

你可以像这样“修复”这个问题：

window.onload = function() {document.body.scrollTop = document.documentElement.scrollTop = 0;};

【讨论】：

这在 FF 中有效，但在 Chrome 中无效，在 IE 中它的行为被顶起。屏幕在正确执行之前会闪烁。

【解决方案4】：

基于comonpyke 的最后评论和我推荐的自己的测试

$(document).ready(function(){
    $('html, body').scrollTop(0);

    $(window).on('load', function() {
    setTimeout(function(){
        $('html, body').scrollTop(0);
    }, 0);
 });
});

第一个 scrollTop 提前滚动
- 文件准备好后
第二次滚动顶部滚动延迟
- 加载事件后
  - 超时后

【讨论】：