防止按钮点击激活 <tr> onclick 事件答案

【问题标题】：Prevent button click from activating <tr> onclick event防止按钮点击激活 <tr> onclick 事件
【发布时间】：2014-05-08 01:25:26
【问题描述】：

我有一个表格，其中一行包含一个单元格中的按钮。 <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>

这可能吗？

【问题讨论】：

标签： javascript jquery css html-table

【解决方案1】：

您可以使用event.stopPropagation()：

防止事件在 DOM 树中冒泡，防止任何父处理程序不会收到事件通知。

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

【讨论】：

这修复了它。感谢您的帮助！
救命答案！

【解决方案2】：

这是事件冒泡，导致父点击被激活。

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

如果你的浏览器是 IE

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

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

【讨论】：

是的，它是事件排序。谢谢你的帮助。