是否可以在某些事件中更改地址栏或浏览器中的URL更改

Question

你们都使用了pinterest，你可以看到当你点击任何一个引脚时，会添加一个div并且灯箱会显示在同一页面上，但是url会更改为实际的pin页面。我有相同的灯箱来显示数据，是否可以像这样更改网址？..

我想告诉的一件事是，我有链接，其中有onclick事件调用view（）方法，其中我调用另一个页面的ajax请求，在我的页面上显示该页面的内容，我想要点击此链接时更改网址，关闭时返回上一个网址。我的代码是

function view(){
   $.get('mypage.jsp', function(html) {
   $(html).hide().appendTo('body').fadeIn(500);
   }, 'html');
};

Answer 1

此功能称为HTML5 Push State。这是一个相关的StackOverflow问题，可以提供更多的见解。 Good tutorial for using HTML5 History API (Pushstate?)

Answer 2

我没有检查过Pintrest的解决方案。但 hash 你在寻找什么？

window.location.hash="Whatever-you-want-to-add-to-the-URL"

这会将http://stackoverflow.com/posts/11968693/更改为http://stackoverflow.com/posts/11968693/#Whatever-you-want-to-add-to-the-URL

Answer 3

是的，使用HTML5的新history API。触发灯箱的地方，添加如下内容：

var hist = window.history;
hist.pushState({ image: [IMAGE URL] }, 'lightbox', [URL]);

这将更改当前URL而不重新加载页面，并将在浏览器历史记录中创建一个条目，因此用户可以使用其浏览器返回按钮返回到先前的状态（在这种情况下，在打开灯箱之前）。

Answer 4

您可以使用history对象上的pushState或replaceState函数更改url（不仅是哈希）。更多详情：http://diveintohtml5.info/history.html