在网站中实施历史记录不起作用

Question

这是我网站上的事件流

1. 转到 [http://example.com]。网页显示来自http://example.com/foo 的内容，即使浏览器地址栏显示http://example.com

   网页上的文字要求用户签出栏。用户点击链接并被带到

2. [http://example.com/bar]

   网页上的文字要求用户签出 baz。用户点击链接并被带到

3. [http://example.com/baz]

   网页上的文字要求用户签出 qux。然而，用户点击浏览器的后退按钮并被带到

4. [http://example.com/bar]

   网页上的文字要求用户签出 baz。然而，用户点击浏览器后退按钮并被带到......失败！这是浏览器栏应该变成 [http://example.com] 的地方，但它根本没有改变。

实现这一切的代码相当简单

var goTo: function(uri) {
    get uri via XMLHttpRequest
    swap content
    history.pushState(null, null, uri);
}

window.addEventListener("popstate", function(event) {
    var uri = location.pathname.replace("\/", "");
    goTo(uri);
}, false);

Answer 1

问题解决了。有关详细信息，请参阅 HTML 5 History - window.pushState not working，但简而言之，我不能在 popstate 事件中包含 history.pushState()。将两者隔离后，效果很好。