Question

我正在使用jquery BBQ插件来处理我的ajax hashchange事件和历史状态。我的问题是它没有保存滚动位置，因此当我使用后退按钮时，滚动条不会定位在散列更改之前的位置，而是位于按下后退按钮之前的相同像素位置。我已经看到这对许多人来说是一个问题，有些人提到使用cookies，但我不知道如何使用BBQ插件，所以所有的帮助表示赞赏。理想情况下，我希望这样，当页面导航到正常时，滚动位于顶部，但是当按下后退按钮时，滚动位于该页面上的位置。这是我的代码：

$(function(){

var cache = {
    '': $('.content')
};

$(window).bind( 'hashchange', function(e) {
    var url = $.param.fragment();
    var scroll = $('#wrapper').scrollTop();
    $( '.contentarea' ).children( ':visible' ).hide();
    if ( cache[ url ] ) {
        cache[ url ].show();
    } else {
        $( '.content-loading' ).show();
        cache[ url ] = $( '<div class="pageURL"/>' )
        .appendTo( '.contentarea' )
        .load( url, function(){
            $( '.content-loading' ).hide();
        });
    }
})

$(window).trigger( 'hashchange' );

$('#btn-back').click(function(){
    parent.history.back();
    return false;
});
});

感谢。

Answer 1

找到一种更简单的方法来解决问题所需的结果。

不是将内容直接加载到容器div中，而是在正在加载的页面的模板文件中，将整个页面内容包装在它自己的容器div中。使它的宽度和高度为100％，以便它与加载内容的容器div的大小完全相同，并在新容器div上启用溢出（最好将溢出设置为隐藏在原始容器div上）。

这样做，原始容器div将永远不会有滚动位置，但模板文件中的新容器将是，div和滚动位置将自动与页面一起保存在浏览器历史记录中。现在，前进然后返回将保持新容器的位置，用户将完全离开页面之前的位置。

- ）

Ajax在hashchange（BBQ插件）之前保存div的滚动位置

1 个答案: