Question

我有这段代码：

window.history.pushState(newUrl, "", newUrl);

我的问题是，如何确保在执行pushState时，浏览器后退按钮将正常运行，换句话说应该“返回”？

（不使用jquery）

Answer 1

后退按钮的正常行为是浏览器返回上一个文档，但是当您使用pushState时，不是以前的文档。< / p>

pushState的目的是在更新网址时将浏览器保留在相同的文档上。这伴随着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>

Answer 2

推送是为了推动...添加

你应该去history.back()

如果你想popState - 在窗口发出popstate事件或做history.replaceState()

如果您要取消已评论的活动：我的回答就是诀窍 https://stackoverflow.com/a/44553087/5694206

使用pushState时如何“浏览器返回”？

2 个答案: