有没有一种方法可以在不重新加载页面的情况下修改当前页面的URL?
如果可能,我想访问#哈希之前的部分。
我只需要更改域之后的部分,所以我不会违反跨域策略。
window.location.href = "www.mysite.com/page2.php"; // this reloads
有没有一种方法可以在不重新加载页面的情况下修改当前页面的URL?
如果可能,我想访问#哈希之前的部分。
我只需要更改域之后的部分,所以我不会违反跨域策略。
window.location.href = "www.mysite.com/page2.php"; // this reloads
当前回答
注意:如果你使用的是HTML5浏览器,那么你应该忽略这个答案。从其他答案中可以看出,这现在是可能的。
在不重新加载页面的情况下,无法在浏览器中修改URL。URL表示最后加载的页面。如果您更改它(document.location),它将重新加载页面。
一个明显的原因是,你在www.mysite.com上写了一个看起来像银行登录页面的网站。然后你将浏览器的URL栏更改为www.mybank.com。用户将完全不知道他们真的在看www.mysite.com。
其他回答
正如Vivart和geo1701所提到的,HTML5 replaceState就是答案。但是,并非所有浏览器/版本都支持此功能。History.js包装了HTML5状态特性,并为HTML4浏览器提供了额外的支持。
在HTML5之前,我们可以使用:
parent.location.hash = "hello";
and:
window.location.replace("http:www.example.com");
此方法将重新加载页面,但HTML5引入了不应重新加载页面的history.pushState(page,caption,replace_url)。
如果您想更改url但不想将条目添加到浏览器历史记录中,也可以使用HTML5 replaceState:
if (window.history.replaceState) {
//prevents browser from storing history with each change:
window.history.replaceState(statedata, title, url);
}
这将“破坏”后退按钮功能。在某些情况下,这可能是必需的,例如图像库(您希望后退按钮返回到库索引页,而不是返回到您查看的每个图像),同时为每个图像提供自己的唯一url。
使用HTML5历史API中的history.pushState()。
有关详细信息,请参阅HTML5历史API。
您可以在应用程序的任何位置使用这个美丽而简单的功能。
function changeurl(url, title) {
var new_url = '/' + url;
window.history.pushState('data', title, new_url);
}
您不仅可以编辑URL,还可以同时更新标题。