javascript - 更改查询字符串而不重新加载/刷新

Question

这个问题已经有答案了:

Updating address bar with new URL without hash or reloading the page [duplicate] (4 个回答)

已关闭 7 年前。

我想在点击时更改我的网址而不刷新页面。例如我的网址是 http://test.com?search=test

当我点击搜索页面上的任何过滤器值(例如“类别”)时，我的 URL 应该是:

http://test.com?search=test$category=cat1

当我点击另一个类别时，它应该是:

http://test.com?search=test&category=cat1,cat2

当我点击一个品牌时，URL 应该是:

http://test.com?search=test$category=cat1,cat2&brand=br1

当我取消选择类别时，URL 应为:

http://test.com?search=test$category=cat2&brand=br1

请帮助我。

Answer 1

您可以通过历史API更改它

window.history.pushState("object or string", "Title", "/new-url");

在这种情况下，相对/new-url 将使用新标题进行设置。您可以在控制台中进行试验。如果您在 stackoverflow.com 上输入此内容，网址将神奇地更改为 https://stackoverflow.com/new-url