防止按钮点击触发<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>

这是可能的吗？

- John 'Mark' Smith

Answer 1

您可以使用event.stopPropagation()：

防止事件冒泡到DOM树上，从而防止任何父处理程序被通知该事件。

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

- Felix

---

这解决了问题。感谢您的帮助！ - John 'Mark' Smith

救命之答案！ - Rico Humme

Answer 2

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

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

如果您的浏览器版本低于IE9，可以尝试以下方法：

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

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

- pj013

---

是的，这是事件排序。谢谢你的帮助。 - John 'Mark' Smith