我有這樣的代碼:如何在使用pushState時「瀏覽器返回」?
window.history.pushState(newUrl, "", newUrl);
我的問題是,如何確保這樣做時pushState的瀏覽器的後退按鈕將作爲正常的,或者換句話說應該走「背」?
(不使用jQuery)
我有這樣的代碼:如何在使用pushState時「瀏覽器返回」?
window.history.pushState(newUrl, "", newUrl);
我的問題是,如何確保這樣做時pushState的瀏覽器的後退按鈕將作爲正常的,或者換句話說應該走「背」?
(不使用jQuery)
推是推...添加
你應該去history.back()
如果你想popState - 在窗口放出popstate
事件或做history.replaceState()
如果您想cancell評論事件: 我的答案會做的伎倆 https://stackoverflow.com/a/44553087/5694206
不,我的意思是當用戶按後退按鈕它不會回到前一頁 – xybrek
更新與鏈接到我的答案 –
的後退按鈕的正常行爲是瀏覽器返回到之前的文件,但是當你用pushState
,有ISN 't以前的文件。
pushState
的要點是在更新URL時保持瀏覽器在相同的文檔中。伴隨着JavaScript應用DOM更改。
這是一個模擬轉到新頁面。
要使後退按鈕看起來可行,您需要編寫一個匹配的前往頁面的模擬。
您可以通過收聽a popstate
event來做到這一點。
Page <span id="p">1</span>
<button>Next</button>
<script>
document.querySelector("button").addEventListener("click", function() {
document.getElementById('p').textContent++;
history.pushState({}, "", "/" + document.getElementById('p').textContent);
});
addEventListener("popstate", function (e) {
document.getElementById('p').textContent--;
e.preventDefault();
});
</script>
你是什麼意思?爲什麼它不能正常工作?或者你的意思是你想要使用[replaceState()](https://developer.mozilla.org/en-US/docs/Web/API/History_API#The_replaceState()_method)? – Faris
不,我的意思是當用戶按後退按鈕它不會回到前一頁 – xybrek
@xybrek如果用戶按下瀏覽器後退按鈕,爲什麼它不會返回?你的瀏覽器有缺陷嗎? – Black