window.onpopstate不工作;當我回到頁面

Question

什麼都沒有發生我試圖在我的網站上的其中一個頁面上添加window.onpopstate，但沒有任何事情發生。我把頁面上的這個腳本：

<script type="text/javascript"> 
    window.addEventListener('popstate', function(event) { 
     if (event.state) { 
      alert(event.state); 
     } 
    }, false); 
</script> 

我也試過：

window.onpopstate = function() { 
    alert("popped!"); 
} 

但是當我回到該網頁我沒有得到任何警報。

Answer 1

只有當您添加一個或多個歷史記錄條目並且稍後用戶單擊瀏覽器中的按鈕時，纔會得到popstate事件。

向瀏覽器歷史記錄添加條目可讓您更改URL（就像用戶導航到另一個頁面一樣），但實際上並未加載新頁面。

你加一個歷史條目與pushState方法：

history.pushState({}, '', '/newpage'); 

當你添加一個條目，用戶點擊回的URL切換回前一個但未裝載在該地址的頁面。而是觸發一個popstate事件。

見https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Manipulating_the_browser_history

---

例外：

舊的瀏覽器不支持popstate事件和瀏覽器的歷史記錄的操作。

某些瀏覽器（例如Safari）會在頁面實際加載時觸發popstate事件。