在unbeforeunload上更改location.hash

Question

我有一個使用JavaScript生成的頁面。 我想將$(window).scrollTop()值存儲在散列中（例如$(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); 
});