Question

我正在尝试创建一个链接，当单击时，切换其href属性，然后转到该位置。

我的HTML是：

<a href="http://google.com" rel="group" data-wpurl="http://yahoo.com"></a>

点击后，我希望浏览器转到data-wpurl位置，而不是href位置。我使用数据属性的原因是因为我使用的应用程序需要使用href ...这里不相关。

我的jQuery是：

$('a[rel="group"]').on('click', function(e) {
      e.preventDefault();
      var wpurl = $(this).attr("data-wpurl");
      $(this).attr('href', wpurl);
});

我正在使用e.preventDefault（）;防止浏览器将用户带到href。将数据属性分配给href后，如何触发单击？使用trigger('click')和click();无效！

有什么想法吗？

Answer 1

类似的解决方案，但无需调用e.preventDefault()

$('a[rel="group"]').on('click', function(e) {
    e.originalEvent.currentTarget.href = $(this).data('wpurl');
});

从我的角度来看，这是一个更通用，更清洁的解决方案，因为这不会改变默认的浏览器行为（例如：当用户点击链接上的鼠标滚轮时，使用Jacks解决方案没有新选项卡将是开）

Answer 2

立即更改位置会更容易：

e.preventDefault();
location.href = $(this).data('wpurl');

Answer 3

使用onmousedown。 Google会在搜索结果页面上使用此方法，以便他们可以跟踪您点击的内容。如果您想查看链接的位置，请右键单击而不是向左键。它们都会触发onmousedown事件。

http://jsfiddle.net/afLE3/

<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>

Answer 4

我认为你的原始jQuery很好，除了e.preventDefault（）：这将停止事件触发，无论你在那之后对href属性做了什么。

$('a[rel="group"]').on('click', function(e) {
      var wpurl = $(this).attr("data-wpurl");
      $(this).attr('href', wpurl);
});

以上所有代码都将在页面刷新之前执行。

单击jQuery后更改链接href

4 个答案: