Onclick 使用 jquery 更改 url答案

【问题标题】：Onclick change url using jqueryOnclick 使用 jquery 更改 url
【发布时间】：2013-12-26 20:24:38
【问题描述】：

我正在尝试使用 jquery 更改网址。

因此，一旦单击按钮，它将更改父 url，但不会重定向。

例如，如果url是，

http://www.xyz.com 那么它会变成http://www.xyz.com/abc 但不会被重定向。

我的代码：

$('.clickme').click(function () {
    window.location.hash = 'xyz';
});

有可能吗？

请提出建议。

【问题讨论】：

【解决方案1】：

幸运的是，Javascript 可以修改浏览器的历史记录，并更改 url。此示例将向浏览器的历史记录添加新行，您可以使用后退按钮转到该页面。

HTML：

<a href="http://www.xyz.com/abc" id="link">abc</a>

jQuery:

$('#link').click(function() {
   window.history.pushState('obj', 'newtitle', '/abc');
   return false;
});

或者如果你想使用 url 哈希（就像在你的代码中一样）：

$('#link').click(function () {
    window.location.hash = 'xyz';
    return false;
});

这不会重定向，它会停留在页面上。

【讨论】：

谢谢@aksu。在第一个示例中，所有浏览器/版本都支持它吗？
它得到了相当广泛的支持，即使在某些移动浏览器中也是如此！您可以在caniuse.com/#feat=history 上查看更多信息。
搜索引擎忽略主题标签，因此它们不会被编入索引。您可以在该博客上阅读更多内容phoenixrealm.com/the-power-of-the-hash-in-seo
我会投反对票，但我的声誉很低……永远不要为此使用“return false”。你想要做的是“event.preventDefault()”！
更容易记住。

【解决方案2】：

你需要修改历史记录而不是 window.location

示例代码

var stateObj = { foo: "bar" };
history.pushState(stateObj, "page 2", "bar.html");

【讨论】：