javascript - 如果单击复选框，防止 TD onclick 触发？

Question

我有一个执行此操作的点击事件:

$('table tbody td').click( function (e) {
   // How to check if checkbox was clicked before doing the alert below?
   alert("td clicked");
}

但是在我的表中，我有一些带有复选框的 td，单击这些复选框会触发事件。有没有一种方法可以在 Jquery 中指定检查 td 内的点击是否在复选框上并且不发出警报？

Answer 1

您可以告诉 jQuery 阻止复选框将事件从您的 checkbox 传播到您的 td

$('table tbody td input[type=checkbox]').click( function (e) {
   // How to check if checkbox was clicked before doing the alert below?
   e.stopPropagation();
}

基本上发生这种情况是因为当您单击 checkbox 时，浏览器会将 click 事件从您的复选框冒泡到您的复选框的父级，然后上升所有一直到 document，上面的代码基本上停止了从您的复选框传播。

阅读event bubbling