Question

我按照规范将所有代码都放在$（document）.ready中，但是我应该把这个'popstate'监听器放在这段代码的最后吗？或者重要吗？

Answer 1

这并不重要，因为它是一个事件，甚至可以在ready方法之前完成。唯一需要放在document ready内的是与DOM交互的代码。其他所有内容都没有（也可能不应该）准备好文件。

示例：

window.onpopstate = function() {
    // binding this event can be done anywhere, 
    // but shouldn't be inside document ready
};

$(document).ready(function() {
    // DOM manipulation and other stuff
});

现在，popstate实际被触发时与绑定时有很大不同。根据Mozilla文档：

每次活动历史记录条目更改时，都会将popstate事件分派到窗口。如果正在激活的历史记录条目是通过调用history.pushState（）创建的，或者受到对history.replaceState（）的调用的影响，则popstate事件的state属性包含历史记录条目的状态对象的副本。

Answer 2

我很困惑，因为popstate在每个页面加载时都会触发（我使用chrome）。

来自https://developer.mozilla.org/en-US/docs/DOM/window.onpopstate：

浏览器倾向于在页面加载时以不同方式处理popstate事件。 Chrome和Safari总是在页面加载时发出popstate事件，但是 Firefox没有。

因此在chrome（显然是safari）中，将执行jquery ready方法，然后执行popstate事件。即，如果您将事件附加到就绪（或者就此而言是body.onload）并不重要，那么popstate事件将在您的就绪方法完成后发生。

在firefox（16.0.1）中，popstate事件不会在页面加载时触发（我无法测试IE 10）。

Answer 3

每次推送到历史记录或替换状态时，只需在状态中添加一个键，并在popstate事件中检查它，如果你根本不使用状态，你可以简单地按{}作为状态并退出如果event.state为null，则为pop状态。

Answer 4

https://developer.mozilla.org/en-US/docs/Web/API/WindowEventHandlers/onpopstate

调用history.pushState()或history.replaceState()不会触发popstate事件。在同一文档的两个历史记录条目之间导航时，只有通过执行浏览器操作（例如单击后退按钮（或在JavaScript中调用history.back()）才能触发popstate事件。

popstate什么时候开火？

4 个答案: