给定一个带有 ajax 导航的 webapp,您打算使用 html5 的历史导航。
但是:绑定到它不会触发的 popstate 事件。除了页面加载,当它是:
如果 HTML5 可用(检测正确,演示在 Chrome 中的效果与 FF 一样好):
// Callback
function historyChangeHandler(data) {
console.log(data);
}
// Bind
$(window).bind('popstate', historyChangeHandler);
// Trigger
$("a").click(function(e) {
var url = "/";
// ...
console.log("clicked");
history.pushState({url: url}, "", url);
return false;
});
什么不起作用:
- 单击链接时不会调用 popstate 回调 historyChangeHandler()。也就是说,打印的是 clicked,而不是事件。
我尝试了什么:
- 使用 setTimeout 推迟 pushState 调用。
- e.preventDefault(); 并返回 true 而不是 false
- 也附加到 div-s 并返回 true
有什么作用:
- historyChangeHandler() 在页面加载时被调用。
- historyChangeHandler() 在按下后退按钮时被调用。
- historyChangeHandler() 在按下前进按钮时被调用。
- historyChangeHandler() 如果从控制台调用 history.pushState({url: "/test"}, "", "/test") !
有什么我想念的线索吗?