Question

我正在使用以下jQuery Javascript在卸载事件之前保存滚动条位置并重新应用它：

$(document).ready(function () {
    document.documentElement.scrollTop = $.cookie("scroll") || 0;
});

window.onbeforeunload = function () {
    $.cookie("scroll", document.documentElement.scrollTop, { expires: 7 });
}

基本上我有一系列刷新页面的链接，我希望浏览器恢复滚动条位置。注意我不能在这个实例中使用AJAX。它在Firefox中很有用。在Chrome和Safari中，它仅在刷新浏览器窗口时有效，而不是在单击链接刷新页面时有效。就好像点击链接没有被识别为onbeforeunload。

我尝试修改代码以使用click事件设置滚动cookie，如下所示，没有运气：

$(document).ready(function () {
    document.documentElement.scrollTop = $.cookie("scroll") || 0;
});

$('a.lockscrollbar').click(function() {
    $.cookie("scroll", document.documentElement.scrollTop, { expires: 7 });
}

仅供参考我正在使用带有jQuery cookie插件的jQuery 1.4.2。

有什么想法吗？

Answer 1

这是一篇较旧的帖子，但我在Chrome 20中遇到了同样的问题。使用jQuery 1.7.1这对我有用：

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

Answer 2

在使用Chrome 10之前，这可以像魅力一样工作......现在它似乎只适用于Firefox（任何人都在IE9中测试过？）

var y = $(window).scrollTop();
$('html, body').animate({scrollTop:(y + 50)}, 1000);

Answer 3

在Chrome和Safari中滚动<body>效果不佳，或者根本不可能。我不知道为什么，I once had a similar problem并且我使用嵌套在<div>内的<body>修复了它。

Answer 4

这是我使用的代码（我正在处理的网站仍然处于构建阶段，但这有效）：

$(document).ready(function(){
    $(window).scroll(function(){
        var posY = $(document).scrollTop();
        $('#trigger').click(function(){
            if($.browser.webkit){
                $('body').stop().animate({scrollTop:0},'slow');
            }else{
                $('html').stop().animate({scrollTop:0},'slow');
            }
        });
    });
});

当滚动的对象是'html'时，Webkit不会滚动到顶部，所以首先我检查浏览器类型（在你说它之前我知道jQuery.support会更好 - 就像我说仍然在构建阶段）。 webkit以外的浏览器接受'html'选择器，因此我将其用于所有其他浏览器（令人讨厌的是，使用'html'在Opera中工作但不在Chrome中工作，使用'body'在Chrome中工作但不在Opera中工作......！）。

jQuery Javascript scrollTop在Chrome上无法正常工作以恢复滚动条位置

4 个答案: