在JavaScript中，有没有一种方法可以捕获后退按钮事件？

Question

在仅有网址哈希值改变而浏览器不会与服务器通讯或重新加载页面时，是否有一种方式能够在JavaScript中响应后退按钮（或按下退格键）的操作？

- Steven Noble

Answer 1

使用 hashchange 事件：

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

如果你需要支持旧版浏览器，请查看Modernizr的HTML5跨浏览器补丁维基页面中的hashChange事件部分。

- insin

---

很高兴看到StackOverflow的答案已经成为旧问题在谷歌搜索中排名靠前的内容。这对我有用，但是如果调用的代码出现问题，则会有一些条件不允许哈希更改行执行。一个好的提示可能是将其放在最后执行。 - ironfroggy

在当前的浏览器中，您应该使用onhashchange事件。http://msdn.microsoft.com/en-us/library/cc288209(v=vs.85).aspx - EricLaw

答案有很好的改进。 - pqsk

Answer 2

我曾做了一个有趣的hack来解决这个问题，让我非常满意。我的网站使用AJAX动态加载内容，然后修改window.location.hash，在$(document).ready()中运行代码来解析哈希值并加载适当的部分。然而，我很满意我的导航部分加载代码，但想添加一个拦截浏览器前进和后退按钮的方法，这将更改窗口位置，但不会干扰我当前的页面加载例程，其中我操作窗口位置，并且轮询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);

现在我的部分加载程序通常在运行，但如果用户点击“后退”或“前进”按钮，新位置将被解析并加载相应的部分。

- Tom Penzer

Answer 3

请查看history.js。这里有一个html 5状态变化事件，您可以侦听它。

- JulianW

Answer 4

onLocationChange可能也很有用。不确定这是否只适用于Mozilla，看起来可能是。

- pix0r

Answer 5

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

- powtac

---

这真的很有趣。现在我需要弄清楚它是如何实现这种行为的。 - Steven Noble

以上链接已经失效，这就是为什么总结链接内容非常重要的原因。 - Scott Schupbach