使用 jQuery 单击后更改链接 href
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/16425260/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Changing a links href after click with jQuery
提问by JCHASE11
I am trying to create a link that when clicked on, switches its href attribute, and then goes to that location.
我正在尝试创建一个链接，当单击该链接时，切换其 href 属性，然后转到该位置。
My html is:
我的 html 是：
<a href="http://google.com" rel="group" data-wpurl="http://yahoo.com"></a>
When clicked, I would like the browser to go to the data-wpurl location, not href location. The reason I am using a data attribute is because of the application I am using requires use of the href...not relevant here.
单击时，我希望浏览器转到 data-wpurl 位置，而不是 href 位置。我使用数据属性的原因是因为我使用的应用程序需要使用href...这里不相关。
My jQuery is:
我的 jQuery 是：
$('a[rel="group"]').on('click', function(e) {
e.preventDefault();
var wpurl = $(this).attr("data-wpurl");
$(this).attr('href', wpurl);
});
I am using e.preventDefault(); to prevent the browser from taking the user to the href. After the data attribute is assigned to the href, how do I then trigger a click? Using trigger('click')and click();do not work!
我正在使用 e.preventDefault(); 以防止浏览器将用户带到 href。将数据属性分配给 href 后，如何触发点击？使用trigger('click')和click();不工作！
Any ideas?
有任何想法吗？
采纳答案by Ja?ck
It would be easier to just change the location immediately:
立即更改位置会更容易：
e.preventDefault();
location.href = $(this).data('wpurl');
回答by Gerwald
Similar solution, but without the need of calling e.preventDefault()
类似的解决方案，但无需调用 e.preventDefault()
$('a[rel="group"]').on('click', function(e) {
e.originalEvent.currentTarget.href = $(this).data('wpurl');
});
from my point of view, this is a more general, cleaner solution, as this will not change the default browser behaviour (e.g.: when the user clicks with the mouse wheel on the link, with Hymans solution no new tab will be opened)
在我看来，这是一个更通用、更简洁的解决方案，因为这不会改变默认的浏览器行为（例如：当用户用鼠标滚轮点击链接时，使用 Hymans 解决方案不会打开新选项卡）
回答by Dan
Use onmousedown. Google uses this method on their search results page so they can track what you clicked. If you want to see where the link will go, right click instead of left. They both trigger the onmousedown event.
在鼠标上使用。谷歌在他们的搜索结果页面上使用这种方法，以便他们可以跟踪您点击的内容。如果您想查看链接的去向，请右键单击而不是左键单击。它们都触发 onmousedown 事件。
<a href="http://google.com" data-wpurl="http://yahoo.com" onmousedown="rwt(this)">CLICK HERE</a>
<script type="text/javascript">
rwt = function(e){
e.href = $(e).data('wpurl');
}
</script>
回答by Ross Angus
I think your original jQuery is fine, except for the e.preventDefault(): this will stop the event firing, no matter what you do to the href attribute after that point.
我认为您的原始 jQuery 很好，除了 e.preventDefault()：这将停止事件触发，无论您在那之后对 href 属性做什么。
$('a[rel="group"]').on('click', function(e) {
var wpurl = $(this).attr("data-wpurl");
$(this).attr('href', wpurl);
});
All of the above code will execute before the page refreshes.
以上所有代码都会在页面刷新前执行。
