HTML5 history.pushState答案

【问题标题】：HTML5 history.pushStateHTML5 history.pushState
【发布时间】：2013-03-04 05:18:08
【问题描述】：

我正在使用history.pushstate方法将历史添加到浏览器中，并在浏览器中添加历史如下。

       history.pushState("", "",myurl);

正确添加到浏览器中的历史记录。（当浏览器历史记录单击正确的页面加载时。）

但是当我点击浏览器中的后退按钮时它不会返回..

（即我正在使用 hashchange 功能在页面中显示不同的内容）。

实际上它需要再次单击才能返回。（即两次单击返回按钮可以返回到历史记录中添加的上一页）。

我怎样才能让它一键后退按钮。

【问题讨论】：

这是一个使用 HTML5 历史的教程的 SO 问题：Good tutorial for using HTML5 History API (Pushstate?)。正如答案所述，您应该考虑使用History.js。

【解决方案1】：

不要将hashchange 用于历史记录；这仅适用于片段更改。使用popstate。

window.addEventListener('popstate', function () {

});

【讨论】：

【解决方案2】：

我找到了一个可行的解决方案，如下所示。

使用 replacestate 代替 pushstate 解决了这个问题。

Pushstate 添加历史记录，但它不指向堆栈的顶部。因此，首先单击加载历史记录中的同一页面，然后单击加载上一个页面。

【讨论】：