location.hash和后退历史记录

Question

有没有一种可以被调用的函数，可以在更改哈希值时防止浏览器记录后退历史记录条目？

我正在编写一个简单的javascript画廊，当用户在每个图像之间移动时，它会更改浏览器的URL而不重新加载页面。

这是通过将location.hash设置为图像的唯一ID来完成的。

window.location.hash = imageID;

问题是当用户点击浏览器的后退按钮时，他们必须像重新加载页面一样逐个向后移动每个图像。

如果他们在画廊中旋转了20张图片，则必须单击21次后退按钮才能返回到以前的页面。

如何使用JavaScript防止后退历史记录？

- George Filippakos

Answer 1

window.location.replace 可以让您设置URL而不将其添加到浏览器历史记录中。

var baseUrl = window.location.href.split('#')[0];
window.location.replace( baseUrl + '#' + imageID );

文档

- jalbee

---

虽然这也回答了我的问题，但我把答案给了 Charles，因为他先回答了。谢谢。 - George Filippakos

@GeorgeFilippakos，不是这样的 - 接受的答案应该是最好回答你问题的那个。显然，这一个更好。 - Déjà vu

你甚至不需要计算基本URL。你只需要执行 window.location.replace( '#' + imageID ); - Peter Selinger

Answer 2

你可以使用 replaceState() 方法。

在更改哈希之前，保存历史记录，然后更改哈希，最后使用保存的历史记录替换它。

或者，你可以使用 popState 事件。

- Charles

---

谢谢你指引我正确的方向。这种方法还可以让我完全不需要使用 # :) - George Filippakos