javascript - window.onpopstate 不工作；当我导航回页面时没有任何反应

Question

我正在尝试添加 window.onpopstate在我网站上的一个页面上，但什么也没发生。我把这个脚本放在页面上:

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

我也试过:

<script type="text/javascript">
  window.onpopstate = function() {
    alert("popped!");
  }
</script>

但是，当我导航回该页面时，我没有收到任何警报。

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

异常(exception):

旧版浏览器不支持 popstate事件和浏览器历史的操作。

一些浏览器(例如 Safari)触发 popstate页面实际加载时也发生事件。