有没有办法在javascript中捕获后退按钮事件？答案

【问题标题】：Is there a way to catch the back button event in javascript?有没有办法在javascript中捕获后退按钮事件？
【发布时间】：2010-09-13 07:26:27
【问题描述】：

当只有位置哈希发生变化时，有没有办法在 javascript 中响应被点击的后退按钮（或按下退格键）？也就是说当浏览器没有与服务器通信或重新加载页面时。

【问题讨论】：

标签： javascript

【解决方案1】：

使用hashchange 事件：

window.addEventListener("hashchange", function(e) {
  // ...
})

如果您需要支持旧版浏览器，请查看 Modernizr 的 HTML5 Cross Browser Polyfills wiki 页面中的 hashChange Event section。

【讨论】：

很高兴看到来自 StackOverflow 的答案已经登上了谷歌热门问题的榜首。这对我有用，但是如果我调用的代码发生了一些问题，如果它改变了，这并没有让哈希更改行执行。一个好的建议可能是最后做。
在当前浏览器中，应该使用 onhashchange 事件msdn.microsoft.com/en-us/library/cc288209(v=vs.85).aspx
对答案的改进。

【解决方案2】：

查看history.js。有一个html 5 statechange事件，你可以听一下。

【讨论】：

【解决方案3】：

我做了一个有趣的 hack 来解决这个问题，让我很满意。我有一个动态加载内容的 AJAX 站点，然后修改 window.location.hash，并且我有代码在 $(document).ready() 上运行以解析哈希并加载适当的部分。问题是我对用于导航的部分加载代码非常满意，但想添加一种方法来拦截浏览器的后退和前进按钮，这会改变窗口位置，但不会干扰我当前操作的页面加载例程window.location，并且以恒定的时间间隔轮询 window.location 是不可能的。

我最终做的是这样创建一个对象：

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 = 行之前添加以下行：

pageload.ignorehashchange = true;

然后是每个哈希修改行之后的以下行：

setTimeout(function(){pageload.ignorehashchange = false;}, 100);

所以现在我的部分加载例程通常正在运行，但是如果用户点击“后退”或“前进”按钮，则会解析新位置并加载相应的部分。

【讨论】：

【解决方案4】：

我创建了一个solution，它可能对某些人有用。只需将代码包含在您的页面上，您就可以编写自己的函数，当单击返回按钮时将调用该函数。

我已经在 IE、FF、Chrome 和 Safari 中进行了测试，并且都可以正常工作。我的解决方案是基于 iframe 工作的，不需要持续轮询，在 IE 和 FF 中，但是由于其他浏览器的限制，在 Safari 中使用位置哈希。

【讨论】：

这看起来很漂亮，并且有一个推荐。其他人有什么好话要说吗？
我不知道为什么它对我不起作用，顺便说一下，我使用了 angular，当我刚刚加载 js 文件时，hash url 开始进入 prev 和 next forerver。
而不仅仅是提供一个链接并解释你测试它 - 如果你能解释它是如何工作的以及你为什么选择走这条路，那将非常有帮助。

【解决方案5】：

你看过这个吗？ http://developer.yahoo.com/yui/history/

【讨论】：

这真的很有趣。现在我需要弄清楚它是如何做到这一点的
上面的链接坏了，这就是为什么总是总结链接的内容很重要。

【解决方案6】：

onLocationChange 也可能有用。不确定这是否是 Mozilla 独有的东西，但似乎它可能是。

【讨论】：