jQuery

Question

我已将一些数据放入 HTML table。单击 tr 时，它会将 'checked' 属性添加到该特定行的复选框。

但是，我有几行在 span 中包含相同的父 ID - 当我单击父 ID 时，它应该向具有此 ID 的所有行添加一个 'checked' 属性。我的方法是进行两种不同的操作 - 一种用于单击 table 行

$('tr').on('click', function() { ... do stuff ... });

当您单击 span

中的 tr 时的另一个操作

$('tr > span').on('click', function() { ... do something else });

问题是，当我单击 span 时，它也会运行第一个事件。我尝试使用 :not 选择器和 .not() 函数，但我似乎无法让它工作。

这是我的代码（只取了相关部分）：

$('tr').on('click', function() {
    // do checkbox action here
});

$('tr > span').on('click', function() {
    // do multiple checkbox actions here
});

Answer 1

使用.stopPropagation()停止冒泡:

$('tr > span').on('click', function(e) {
  e.stopPropagation();
  // do multiple checkbox actions here
});

jQuery - 单击 TR 和 TR > span 时的不同操作

jQuery - Different actions for when clicking on TR and TR > span

jquery-selectors