Javascript 如何替换位置哈希并只保留最后一个历史记录条目？

我正在使用跟踪用户在页面中的进度。但是，我只想在用户的历史记录中创建一个附加条目，而不是为每个哈希更改创建一个条目

我尝试了

jQuery.bbq.pushState

和方法，但没有成功：仍然添加了新的历史记录条目：

jQuery.bbq.pushState({ sort: encodeURIComponent(sort) });

我也尝试过

location.replace（）

，但这对Safari 5.1.2不起作用

location.replace('#' + encodeURIComponent(sort))

---

在不向历史记录中添加太多条目的情况下，跨浏览器修改哈希的解决方案是什么？

首先，我展示函数

replaceHash

的定义，它只接受一个参数：新位置哈希。答案的底部可以找到对逻辑的详细解释

代码： 功能逻辑

• 如果支持，函数将始终替换当前哈希，而不会产生任何副作用
• 否则，将创建对第一个

  位置的引用（
  hash
  ）。hash

  属性，并定义以下函数：

• 如果

  location.hash！=散列

  ，那么我们可以确定历史记录的状态至少超过了第一页视图。我们可以安全地回到历史，而无需卸载页面

  history.back（）；//返回历史记录

• 然后，设置

  location.hash

  属性。如果我们在上一步中返回历史记录，历史记录条目将被覆盖

回退（最后一个）方法可能并不总是替换历史记录：
当

location.hash==hash

时，以下任一项为真：
• 散列尚未更改，因此返回上一页没有任何意义
• 用户可能向后导航到原始页面的状态。如果我们使用

  history.back（），页面可能已卸载，这是不可取的。
  


因此，为了安全起见，当散列值等于保存的原始散列值时，我们从不卸载页面。

注意：在散列更改之前运行此代码非常重要。当哈希值已经更改时，脚本不再可靠。用户可能已导航到第一个哈希状态，该状态不等于已保存的

哈希

。因此，

history.back（）

将卸载页面

---

您可以使用

窗口中的
replace
-方法。location

，而无需第二个

newSubStr

-参数。这适用于所有已知的浏览器，即使是旧浏览器：

function replaceHash(hash) {
  return window.location.replace(
    '#' + hash.replace(/^#/, '')
  );
}

---

请注意，如果文档中有有效元素（），页面将跳转/滚动到该元素。

您是否已经使用了

replaceState

而不是

pushState

？我在库中没有看到任何此类方法@Rob WI实际上是指该方法。另请参见.history.replaceState在function replaceHash(hash) { return window.location.replace( '#' + hash.replace(/^#/, '') ); }