无需重新加载页面即可更改地址栏中的网址

Question

我发现许多问题都与在不重新加载页面的情况下更改URL有关。一些回答是 - 使用插件，使用location.hash ...或重新加载页面。但对我来说都不起作用。

我在网站上有一个下拉菜单，在其更改时，应更改URL参数。因此，我的目标是：我想将www.foo.com?country=Germany更改为www.foo.com?country=Slovenia，并且不重新加载页面。

我正在尝试实现的目标是否可能？

- Sebastjan

---

您想要更改URL地址栏中向用户显示的内容？出于什么目的？基于安全考虑，我无法想象浏览器会允许这样做。如果您可以提供一个目的，也许我们可以提供一个替代方案。 - Luke Shaheen

我有一个国家列表（下拉菜单），在其更改时，我想要更改URL。为什么？嗯...网站上的所有内容都会更改（无需重新加载），因此我也想更改URL。 - Sebastjan

你看过这个答案了吗？https://dev59.com/InA75IYBdhLWcg3wW3sZ - Luke Shaheen

请查看此演示：http://html5demos.com/history - user1646111

Answer 1

在新版浏览器中，您可以改变URL的路径和查询参数；而在旧版浏览器中，您只能改变URL的哈希值。以下是一篇关于该主题的好文章： http://html5doctor.com/history-api/

- crimson_penguin

Answer 2

你需要的是 HTML5 提供的 History API。它带有一些功能，比如 history.pushState(...)、history.popState(...)，让你可以动态地改变 URL 而不必完全分配一个新的 URL。

许多网站都在使用它，包括我猜测 Facebook 自己，在那里如果你打开聊天框，并在页面之间导航，聊天框不会重新加载。这意味着所有新内容都是通过 Ajax 获取的，但 URL 不会改变，对吧？但实际上它确实改变了。我认为他们是通过 history.pushState(...) 实现的，你只需将一个新状态推入 History 栈中，它就会仅更改页面的某个部分。你可以在这里找到一份优秀的教程。

- SexyBeast