關於使用History.js來管理瀏覽器狀態

Question

History.pushState(data,title,url) 

History.pushState({state:1}, "State 1", "?state=1") 

假設如果我需要存儲頁碼和排序順序，那麼我需要寫什麼代碼？

url部分是強制性的？

如何獲取用戶點擊瀏覽器後退或前進按鈕時的狀態？

假設我有這樣

var PageState= { 
    PageNo:1, 
    SortCol:"Name", 
    SortOrder:"ASC" 
}; 

一個對象，以便我可以將它存儲像這樣

History.pushState({state:PageState}, null, null); ? 

當瀏覽器用戶點擊回來，然後前進按鈕我怎麼能找回狀態從瀏覽器歷史使用History.js lib？

尋找代碼示例。謝謝

Answer 1

URL參數是必需的，因爲這是附加到地址欄中基本URL的內容。如果您想保持同一路徑，但保存新的歷史記錄狀態，則可以使用當前網址：History.pushState(state, null, location.href)。

當歷史狀態改變時，窗口發出一個事件。

var PageState = { 
    PageNo: 1, 
    SortCol: "Name", 
    SortOrder: "ASC" 
}; 

History.pushState(PageState, null, location.href); 

stateChangeHandler = function(event) { 
    // This PageState is the same object defined above 
    var PageState = event.state; 
    var NewLocation = event.target.location.href; 
}; 

// These two statements are nearly equivalent. Only one is needed. 
window.onpopstate = stateChangeHandler; 
window.addEventListener("popstate", stateChangeHandler); 

延伸閱讀：MDN popstate reference