Question

我遇到'popstate'事件处理程序的问题，这是我的代码：

window.addEventListener("popstate", function (event){
    if (event.state) {
        alert('abc')
    }
});

// The data object is arbitrary and is passed with the popstate event.
var dataObject = {
    createdAt: '2011-10-10',
    author: 'donnamoss'
};

var url = '/posts/new-url';
history.pushState(dataObject, document.title, url);

我预计这段代码会在执行时弹出警告框，但没有任何反应。

这里有什么不对吗？

谢谢。

Answer 1

pushState不会触发popstate事件，只需单击后退/前进按钮（或使用退格键）或调用history.back() / history.go(n)就会触发此事件。

此外，在webkit浏览器中，会在页面popstate事件后触发onload事件，但Firefox和IE不会出现此行为。

Answer 2

不，不会，

根据MDN documentation

请注意，只调用history.pushState（）或history.replaceState（）不会触发popstate事件。 popstate事件只能通过执行浏览器操作来触发，例如单击后退按钮（或在JavaScript中调用history.back（））。

根据this question，当您致电popstate时，Chrome内未触发pushState()事件。

Answer 3

根据定义，

history.pushState()不会触发popstate事件。

导航到会话历史记录条目时，在某些情况下会触发popstate事件。

此事件仅在导航到历史记录条目时触发，方法是按后退/前进按钮或history.go/back。

popstate事件处理程序似乎无法正常工作

3 个答案: