阻止按钮单击激活<tr> onclick事件

Question

我有一个表格,其中一行包含一个单元格内的按钮.该<tr>有一个onclick事件.我希望按钮独立于<tr>onclick运行,但在同一行内运行.

HTML:

<tr onclick="$trigger();">
   <td>Data A</td>
   <td>Data B</td>
   <td>Data C</td>
   <td><button onclick="$buttonClicked();">Submit</button></td>
</tr>

这可能吗？

Answer 1

您可以使用event.stopPropagation():

防止事件冒泡DOM树,防止任何父处理程序被通知事件.

$('button').click(function(event) {
    event.stopPropagation();
});

Answer 2

这是事件冒泡,导致父点击被激活.

$('button').click(function(e) {
   e.stopPropagation();
});

如果您的浏览器IE <9,请尝试以下操作:

$('button').click(function(e) {
   e.cancelBubble();
});

http://www.quirksmode.org/js/events_order.html