Question

我有一张tr的表格，您可以点击该表格。这些tr可以包含a。

  <tr id="12" href="/guestbook/edit?id=12">
    <td class="main">
       <strong>Remi</strong>
       <a href="mailto:xxx@xxx">xxx@xxx</a>
    </td>
    <td class="date">05-11-2010 11:34</td>
    <td class="number">ip</td>
  </tr>

这是用于检测tr

上的点击的jquery代码

$('table tr[href]').click(function(e){
   document.location.href = $(this).attr('href');
});

例如，当我点击电子邮件地址时，首先打开我的电子邮件客户端（这很好），然后加载页面编辑（这很糟糕）。是否有可能检测到我点击过的元素？如果它是A或TR？

Answer 1

您可以查看.target of the event并查看.nodeName的内容，如下所示：

$('table tr[href]').click(function(e){
   if(e.target.nodeName == 'A') return;
   document.location.href = $(this).attr('href');
});

正如@ Hannes在评论中所说的那样，最好至少使用一个数据属性，如下所示：

<tr id="12" data-href="/guestbook/edit?id=12">

然后在你的代码中：

$(this).attr('data-href');

或者，在jQuery 1.4.3 +中：

$(this).data('href');

Answer 2

当点击事件发生时，首先在您单击的元素上触发，然后传播到父元素，触发其onclick处理程序。您可以添加到您拥有的代码中来执行此操作：

$('tr[href] a').click(function(e) {
    $(e.target).closest('tr[href]').trigger('click');
    return false;  // stop event propagation (email client won't be called)
});

但我建议您从编辑和删除中删除锚点，因为这样会欺骗您的用户。

检测点击的元素

2 个答案: