小编典典

修改查询字符串而不重新加载页面

all

我正在创建一个照片库,并希望能够在浏览照片时更改查询字符串和标题。

我正在寻找的行为经常出现在连续/无限页面的某些实现中,当您向下滚动查询字符串时,会不断增加页码(http://x.com?page=4)等。这应该是理论上很简单,但我想要在主流浏览器中安全的东西。

我只是希望能够为当前查看的照片添加书签,而无需在每次更改照片时重新加载页面。

这是一个修改查询字符串的无限页面示例:http: //tumbledry.org/

更新 找到了这个方法:

window.location.href = window.location.href + '#abc';

阅读 46

收藏
2022-08-19

共1个答案

小编典典

如果您正在寻找哈希修改,您的解决方案可以正常工作。但是,如果您想更改查询,可以使用
pushState,如您所说。这是一个可以帮助您正确实施它的示例。我测试过,效果很好:

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

它不会重新加载页面,但它只允许您更改 URL 查询。您将无法更改协议或主机值。当然,它需要能够处理 HTML5 History API 的现代浏览器。

了解更多信息:

http://diveintohtml5.info/history.html

https://developer.mozilla.org/en-
US/docs/Web/Guide/API/DOM/Manipulating_the_browser_history

2022-08-19