javascript - 防止 history.replaceState 附加到 url

Question

我正在使用window.history.replaceState并遇到一些问题，因为它一直附加到 url。

它已被标记为这个问题的重复，我认为这是一个错误，因为当我使用该代码时，同样的问题正在发生，并且它不断将索引附加到 url，如下所述。

请在下面查看我的代码：

let index = 1;

function incrementIndexAndUpdateUrl() {
   index++;
   window.history.replaceState('Object', 'Title', `${window.location.href }/${index}`);
}

我遇到的问题是网址不断附加数字，因此它正在执行以下操作：

https://slackoverflowz.com/questions/ask/2/3/4

有谁知道代码应该如何更新网址，如下所示：

• https://slackoverflowz.com/questions/ask/2
• https://slackoverflowz.com/questions/ask/3
• https://slackoverflowz.com/questions/ask/4

还值得注意的是 url 是动态的，所以我不能硬编码路径。我只想更新 url 末尾的索引。

标签： javascripthtml5-history

Answer 1

由于您要附加一个/something，因此您实际上是在更改路径名。因此，简单的方法是在更改之前存储原始文件：

let index = 1;
const path = location.pathname;

btn.onclick = incrementIndexAndUpdateUrl;

function incrementIndexAndUpdateUrl() {
   index++;
   window.history.replaceState('Object', 'Title', `${path}/${index}`);
   console.log(location.href);
}

<button id="btn">increment</button>

作为 Chrome 的小提琴。