javascript history onpopstate

Question

我想了解HTML5歷史對象。這是一個我剛開始使用的簡單例子。

function addDialog(){ 
     document.getElementById('d').style.display =''; 
     history.pushState({name:"changed"},"","#newURL"); 
    } 

    window.onpopstate = function(e){ 
     alert(e.state); 
    } 

我有一個div用一個id爲d這display屬性爲none。在點擊鏈接時，我會顯示div並更改歷史記錄，以便加載新的網址。

當我複製粘貼新網址時，popstate事件被解僱，我得到null爲e.state。

據我所知，如果我加載新的網址http://example.com#newURL，e.state應該指向我使用pushstate推送的對象。

請糾正我，如果我錯了，我也想知道什麼時候e.state得到填充。

Answer 1

正如我測試，e.state只有當您點擊後退或前進按鈕時纔會獲得您添加到歷史記錄中的彈出狀態。否則，它會給你null。

您可以將參數用於URL，以便測試請求是來自歷史記錄調用還是來自位置欄中的URL。

onpopstate = function(event) { 
    alert('popEvent: ' + event); 
    if(event.state){ 
     setupPage(event.state); 
    } else { 
     setupPage(getQStringParam('zid')); 
    } 
}