history.js 在后退按钮上重新加载页面

Question

我是 html5 和 history.js 的新手，仍在尝试掌握 history.js 的概念。这里有两个问题。

1. history.js 只是用来更改地址栏中的 URL 而不刷新页面吗？ （比如使用哈希来操作 url）

2. 我已经使用history.js（here is my fiddle）做了一个简单的代码

第一页的url是http://mysite.com?id=1,2,3

当按下下面的按钮之一时，JS 代码会隐藏该按钮，它会从 url 中删除 ID 并使用 history.js 更改地址栏中的 url

<input type="button" value="delete id 1" data-remove-id="1" class="remove" />

<input type="button" value="delete id 2" data-remove-id="2" class="remove" />

<input type="button" value="delete id 3" data-remove-id="3" class="remove" />

问题是，当我点击后退按钮时，网址会正确更改，但我如何让它取消隐藏隐藏按钮？或者我如何刷新页面？还是我使用ajax？最佳做法是什么？

Answer 1

1. 是的，它允许您保存当前状态信息（如果需要），并将当前 url 推送到历史记录中并将新 url 加载到 url 栏中。它不会重新加载页面。假设您正在客户端上使用与 URL 更改相对应的 javascript（AJAX 调用或其他一些运行的代码）执行某些操作。

2. 您的浏览器的后退按钮和 history.js 不会撤消您已完成的任何 JavaScript 代码。您应该使用 AJAX 重新加载该先前 URL 的页面，该 URL 应该读取隐藏按钮。所以这是一个细微的差别 - 按下后退按钮不会取消隐藏按钮，而是会根据您从另一个 AJAX 调用获得的原始代码重新创建按钮。

更新：

您可以将处理程序绑定到 window.onpopstate 事件。

window.onpopstate = function(event) {
  // your code...
}