使用History API pushState设置后获取历史状态对象

Question

如何获取我使用HTML5 History API设置的状态对象:

var stateObj = { foo: "bar" };
history.pushState(stateObj, null, url);

我在尝试:

$(window).bind('popstate', function(event) {
    alert(event.state);
});

它回来了undefined.

谢谢!

Answer 1

我只需要得到event.state从window.

 alert(window.event.state);

Answer 2

顾名思义，弹出状态事件仅在从历史记录中弹出事件时触发，而不是在将条目推入历史记录时触发。

在您的示例中，如果您有两个历史记录条目，第一个条目是从服务器加载页面时发生的，第二个条目是您刚刚推送的条目。

当您按下浏览器后退按钮时，您在事件中获得的状态是页面加载时的原始条目。popstate 事件为您提供当前所处的状态，而不是刚刚从堆栈中弹出的状态。有点混乱。

在您的示例中，如果您将两个条目推送到堆栈中，两者都带有状态数据，然后单击后退按钮，您的事件处理程序应该向您显示您推送到历史堆栈中的第一个状态的状态数据。