jquery - jQuery/CSS 后代选择器选择过多

Question

我的页面上有几个元素，其中一些包含在一个带有我关心的类的 div 中（在本例中为“workItemRow”）。我只想要具有类 workItemRow 的祖先的元素来触发事件。问题是，每个元素都绑定到事件，而不仅仅是具有祖先的元素。

前任。（实际代码的缩短版）

<div class="workItemRow">
<select class="objective"></select>
</div>

<div>
<select class="objective"></select>
</div>

然后是我的 jQuery：

$('body').on('change', '.workItemRow .objective', function () {
   alert("Why isn't this working?");
});

每次我更改第二个 div 中的选择（没有任何类的那个）时，该事件仍然被触发，我不明白为什么。我尝试将选择器更改为“.workItemRow > .objective”，但它仍然总是调用它。

score 1 · Accepted Answer

你可以做：

$('body').on('change', '.workItemRow > .objective', function () {
   alert("Why isn't this working?");
});

这将选择包含在 element.workItemRow 中的元素（.objective）

1 回答 1