當用戶點擊瀏覽器的後退按鈕時隱藏div

Question

當用戶點擊縮略圖時，會打開一個覆蓋整個屏幕的div，文檔標題和URL都會更改。

$('.view-overlay').show(); 
$('html,body').css("overflow","hidden"); 

// once AJAX is done, in success: 

$('.view-overlay').append(data); 
window.history.pushState('page2', title, url); 
document.title = title; 

當用戶點擊返回按鈕，我想扭轉，用下面的JS執行：

$('.view-overlay').empty().append('<div class="view-close">x</div>').hide(); 
$('html,body').css("overflow","auto"); 
window.history.pushState('page1', "previous title", "previous url"); 
document.title = "previous title"; 

我試圖onbeforeunload，但我不知道這是怎麼會這樣使用

Answer 1

隨着window.onpopstate您檢測事件，如後退按鈕被按下。

編輯：在你的榜樣，你可以這樣做：

window.onpopstate = function() { 
    $('.view-overlay').empty().append('<div class="view-close">x</div>').hide(); 
    $('html,body').css("overflow","auto"); 
    window.history.pushState('page1', "previous title", "previous url"); 
    document.title = "previous title"; 
} 

不過，你不需要手動設置標題或網址，因爲他們在歷史堆棧和瀏覽器自動更新它們。