在浏览器上按下返回按钮时忽略查询参数

Question

我有一个网站，里面有标签。最近，我添加了当前选项卡名称作为查询参数。像www.example.com/page?tab=tab1。这是我用来实现相同代码的代码。

var newurl = window.location.protocol + "//" + window.location.host + window.location.pathname + '?tab=tab1';
window.history.pushState({ path: newurl }, '', newurl);

Similary www.example.com/page?tab=tab2用于同​​一页面中的另一个标签。这种模式使我能够共享带有标签名称的页面，并在页面加载时根据查询参数显示相应的标签信息。

我的问题是，如果用户按下后退按钮，则用户不会返回上一页，而是显示具有上一个选项卡名称的同一页面。

我在查询参数中添加选项卡名称的全部目的是启用与选项卡名称的链接共享，以便我可以直接打开特定的选项卡。

现在，如果用户按下后退按钮，我希望用户导航到上一页，我该怎么做？

Answer 1

检查https://developer.mozilla.org/en-US/docs/Web/API/History_API

使用window.history.replaceState代替window.history.replaceState

replaceState修改当前历史记录条目