有没有办法在JavaScript中捕捉后退button事件?
有没有一种方法来响应后退button被击中(或退格被按下)在JavaScript中只有位置哈希值更改? 也就是说,当浏览器不与服务器通信或重新加载页面时。
使用hashchange
事件:
window.addEventListener("hashchange", function(e) { // ... })
如果您需要支持旧浏览器,请查看Modernizr的HTML5跨浏览器Polyfills wiki页面中的hashChange
Event部分 。
我已经创build了一个可能对某些人有用的解决scheme 。 只需在页面上包含代码,您就可以编写自己的函数,单击后退button时会调用该函数。
我已经在IE,FF,Chrome和Safari中进行了testing,并且都在工作。 在IE和FF中,我使用的基于iframe的解决scheme不需要持续轮询,但是由于其他浏览器的限制,Safari中使用了位置散列。
我做了一个有趣的黑客解决这个问题,我满意。 我有一个dynamic加载内容的AJAX站点,然后修改window.location.hash,我有代码运行$(document).ready()parsing散列和加载适当的部分。 事情是,我非常满意我的部分加载导航代码,但想要添加拦截浏览器的前进和后退button,这改变了窗口的位置,但不会干扰我当前的页面加载例程,我操纵window.location,并以不变的间隔轮询window.location是不可能的。
我最终做的是创build一个对象,如下所示:
var pageload = { ignorehashchange: false, loadUrl: function(){ if (pageload.ignorehashchange == false){ //code to parse window.location.hash and load content }; } };
然后,我添加了一行到我的站点脚本,以在hashchange事件上运行pageload.loadUrl函数,如下所示:
window.addEventListener("hashchange", pageload.loadUrl, false);
然后,无论window.location.hash
我想修改window.location.hash
而不触发这个页面加载例程,我只需在每个window.location.hash =
line之前添加以下行:
pageload.ignorehashchange = true;
然后在每个哈希修改行之后的下一行:
setTimeout(function(){pageload.ignorehashchange = false;}, 100);
所以现在我的部分加载例程通常在运行,但是如果用户点击“后退”或“前进”button,则parsing新的位置并加载相应的部分。
查看history.js 。 有一个HTML 5 statechange事件,你可以听它。
onLocationChange
也可能有用。 不知道这是不是Mozilla的东西,似乎可能是。