jQuery 页面重新加载时的 ScrollTop 不起作用（可能是脚本冲突）
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/19057731/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
ScrollTop on page reload doesn't work (possible script conflict)
提问by anoonimo
I'm working on this page http://dindita.com/preview.html
我正在处理这个页面http://dindita.com/preview.html
I added this to make it scroll to the top when someone refreshes the page but doesn't seem to work, I wonder if it's a conflict with the other scrolling scripts I'm using.
我添加了这个以使其在有人刷新页面但似乎不起作用时滚动到顶部，我想知道它是否与我正在使用的其他滚动脚本冲突。
<script type="text/javascript">
$(document).ready(function(){
$(this).scrollTop(0);
});
</script>
Any clue?
有什么线索吗？
P.s.: work in progress: messy scripts
Ps：正在进行中：凌乱的脚本
回答by sebastian
Try this:
尝试这个：
$(document).ready(function() {
$("html,body").animate({scrollTop: 0}, 100); //100ms for example
});
Or this:
或这个：
window.onload = function() {
setTimeout (function () {
scrollTo(0,0);
}, 100); //100ms for example
}
Or this:
或这个：
$(window).on('beforeunload', function() {
$(window).scrollTop(0);
});
Browsers tend to jump back to their last scroll position on a reload, which makes sense in many cases. It seems that this automatic jump gets triggered right after the onload event (but we don't know the exact moment when this happens), so it makes sense to either use some delay, or have the browser scroll to the top before the page reloads ;)
浏览器往往会在重新加载时跳回到上一个滚动位置，这在许多情况下是有意义的。似乎这种自动跳转在 onload 事件之后立即触发（但我们不知道发生这种情况的确切时刻），因此使用一些延迟或在页面重新加载之前让浏览器滚动到顶部是有意义的;)
回答by Jakub Michálek
Browsers (at least Chrome) change the scroll position after the page is loaded, not when the DOM is ready.
浏览器（至少是 Chrome）在页面加载后更改滚动位置，而不是在 DOM 准备好时。
$(window).load(function(){
$('html, body').scrollTop(0);
});
If that doesn't work (script is still executed before the browser changes scroll position), you can set a timeout:
如果这不起作用（在浏览器更改滚动位置之前仍然执行脚本），您可以设置超时：
$(window).load(function(){
setTimeout(function() {
$('html, body').scrollTop(0);
}, 10);
});
回答by harshes53
I had that Eureka moment when I tried this and it worked:
当我尝试这个时，我有那个尤里卡时刻，它奏效了：
<script> location.hash = (location.hash) ? location.hash : " "; </script>
In <head>of your html. Not sure about single page app! But sure works like charm in regular pages.
在<head>你的 html 中。不确定单页应用程序！但在普通页面中确实像魅力一样工作。
回答by ouija
This is what I came up with to scroll to top but only when document isn't already at the top, and delayed just enough not to cause an issue with it firing properly:
这就是我想滚动到顶部但仅当文档尚未位于顶部时才想到的，并且延迟到不会导致它正确触发的问题：
$(window).load(function() {
setTimeout(function() {
if ($(document).scrollTop() !== 0) $("html, body").animate({ scrollTop: 0 }, 'fast');
}, 300);
});
回答by boj4n
Calling scrollTo and again scrollTo with timer in 10 ms and changing value for 1 px did the job. Working on chrome and safari for each forced refresh.
在 10 毫秒内使用计时器调用 scrollTo 并再次调用 scrollTo 并更改 1 px 的值完成了这项工作。为每次强制刷新处理 chrome 和 safari。
w = 200;
scrollTo(w - 1, 0);
window.setTimeout (function (){scrollTo(w, 0);}, 10);
