如何避免返回到带有 HTML id 属性标记的上一个部分，而是转到上一个网站？

Posted 2023-03-05

【中文标题】如何避免返回到带有 HTML id 属性标记的上一个部分，而是转到上一个网站？

【英文标题】：How to avoid going back to a previous section tagged with an HTML id attribute and go to a previous website instead?

【发布时间】：2019-09-18 13:26:30

【问题描述】：

我有一个包含多个部分（主页、服务、投资组合、联系人）的单页网站。我使用id 属性指向每个部分。

如何避免浏览器存储 #home 或我在历史记录中浏览的任何部分并将我带到上一个网站？

有什么方法可以实现吗？

我搜索的是这与网站状态有关。因此，每次点击任何部分都会通过添加# 和id 的名称来更新URL 中的网站状态。可以使用 javascript 中的 onhashchange 函数更改状态。我不确切知道如何使用它，或者是否可以实施其他方法。

【问题讨论】：

Window.history.replacestate() 可能会有所帮助或使用插件来浏览各个部分。

【参考方案1】：

正如 Aditya Thakur 指出的那样。您可以使用 window.history.replaceState()

这是一个示例代码：

<a href="#home" onclick="handleLink(event, this)">Home</a>

还有handleLink函数：

function handleLink(event, element) 
    event.preventDefault();

    window.history.replaceState(null, "Title", element.href);
  

replaceState 不会在您的浏览器历史记录中添加新条目。因此，当您单击浏览器上的后退按钮时，您将返回上一页。

这是文档：https://developer.mozilla.org/en-US/docs/Web/API/History_API#The_replaceState()_method

希望对你有帮助！

【讨论】：

感谢您的回答。这很完美。 Imma 阅读了更多关于它的内容，以完全了解如何修改行为。