当前位置:  开发笔记 > 编程语言 > 正文

有没有办法在不刷新页面的情况下更改浏览器的地址栏?

如何解决《有没有办法在不刷新页面的情况下更改浏览器的地址栏?》经验,为你挑选了3个好方法。

我正在开发一个网络应用程序.在其中我有一个名为类别的部分,每当用户点击其中一个类别时,更新面板就会加载相应的内容.

用户点击类别后,我想更改浏览器的地址栏网址

www.mysite.com/products 

喜欢的东西

www.mysite.com/products/{selectedCat} 

没有刷新页面.
我可以使用某种JavaScript API来实现这一目标吗?



1> Alfred..:

使用HTML5,您可以修改网址而无需重新加载:

如果你想在浏览器的历史记录中发表新帖子(即后退按钮可以工作)

window.history.pushState('Object', 'Title', '/new-url');

如果您只想更改网址而无法返回

window.history.replaceState('Object', 'Title', '/another-new-url');

该对象可用于ajax导航:

window.history.pushState({ id: 35 }, 'Viewing item #35', '/item/35');

window.onpopstate = function (e) {
  var id = e.state.id;
  load_item(id);
};

在这里阅读更多内容:http://www.w3.org/TR/html5-author/history.html

后备解决方案:https://github.com/browserstate/history.js


+1另请注意; 这些改变了URL中的`path`和/或`query string`; 他们不能改变协议,域或端口(因为这将是一个安全问题,正如其他人所指出的那样).上面的`hash`函数可以改变锚(或片段id)
只是说,在您的示例'/ item/35'}中,添加了一个额外的}
请注意,firefox不支持title,因此请使用document.title ="new title".

2> roborourke..:

添加到已经说过的人编辑window.location.hash属性以匹配onclick函数中所需的URL.

window.location.hash = 'category-name'; // address bar would become http://example.com/#category-name



3> Justin Wigna..:

我相信,出于安全考虑,不允许直接操纵地址栏到一个完全不同的网址而不移动到该网址,如果你对它感到高兴的话

www.mysite.com/products/#{selectedCat}

即在同一页面中的锚式样式链接然后查看现在存在于大多数JavaScript库中的各种历史/"后退按钮"脚本.

提到更新面板让我猜你正在使用asp.net,在这种情况下asp.net ajax历史记录控件是一个很好的起点

推荐阅读
手机用户2402852307
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有