修改查询string而不重新加载页面

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

我正在寻找的行为往往看到连续/无限页面的一些实现,当你向下滚动查询string不断递增页码( http://x.com?page=4 )等。这应该是理论上很简单,但我希望在主stream浏览器中安全。

我发现这个伟大的职位 ,并试图按照window.history.pushstate的例子,但似乎并没有为我工作。 而且我不确定这是否理想,因为我并不在乎修改浏览器历史logging。

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

以下是修改查询string的无限页面的示例: http : //tumbledry.org/

更新发现这个方法:

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

它似乎为我工作,但我在一个新的铬..这可能会导致一些问题与旧的浏览器?

如果你正在寻找哈希修改,你的解决scheme工作正常。 但是,如果您想更改查询,则可以使用pushState,如您所说。 这里是一个可以帮助你正确实施的例子。 我testing,它工作正常:

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

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

了解更多信息:

http://diveintohtml5.info/history.html

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

我已经很成功地使用了下面的JavaScript库:

https://github.com/balupton/jquery-history

它支持HTML5历史loggingAPI以及旧版浏览器的回退方法(使用#)。

这个库本质上是`history.pushState'周围的一个polyfill。

那么历史API就是你正在寻找的。 如果您希望支持传统浏览器,那么在浏览器不提供历史loggingAPI的情况下,查找一个操作URL哈希标记的库。