改变位置.在unbeforeunload上散列

Question

我有一个使用JavaScript生成的页面。我想将$(window).scrollTop()值存储在散列中(如#position=xxx)，这样当页面刷新并再次生成项目时，用户可以继续从他们离开的地方滚动。

我试图修改beforeunload上的哈希值，这似乎不起作用。下面函数的第一部分尝试更改哈希值，第二部分负责在页面加载时修改scrollTop。第二部分工作得很好，我只是被第一部分卡住了。

$(window).on('beforeunload',function(){
    window.location.hash = "position="+$(window).scrollTop();
}).on('load hashchange',function(){
    var scrollregex = /^position=(d+)$/,
        hash = window.location.hash.substring(1);
    if (scrollregex.test(hash)) $(window).scrollTop(parseInt(hash.match(scrollregex)[1]));
});

是否有一个不同的事件，或者当用户触发刷新时我如何改变哈希值?

Answer 1

我最终放弃了散列的想法，转而使用基于sessionStorage的方法。我为会话/本地存储编写了我自己的包装器，我在下面的例子中使用它。

$(window).on('beforeunload',function(){
    var scrltop = $(window).scrollTop();
    if (scrltop > 0) SStorage.set('position',scrltop);
    else SStorage.del('position');
}).on('load',function(){
    if (SStorage.has('position')){
        var pos = parseInt(SStorage.get('position'));
        if (!isNaN(pos) && $(window).scrollTop() === 0) $(window).scrollTop(pos);
    }
});

Answer 2

Chrome似乎不允许你在onbeforeunload事件中更新哈希值。我也有类似的问题。我将代码移到unload事件，这可以工作，但引入了其他问题。为了解决这些问题，我必须强制重新加载，注意，如果没有setTimeout，重新加载将无法工作。

$(window).on('unload', function(){ 
    /* Do hash change here */
    setTimeout(function () { window.location.reload(true); }, 0); 
});