jQuery/CSS後代選擇器選擇太多

我在我的頁面上有幾個元素，其中一些元素被封裝在一個我關心的類（本例中爲「workItemRow」）的div中。我只想要具有類workItemRow的祖先的元素來觸發事件。問題是，每一個元素都與事件相關，而不僅僅是與祖先相關的元素。jQuery/CSS後代選擇器選擇太多

Ex。和（縮短了實際的代碼的版本）

<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」，但它仍然始終調用它。

它工作正常http://jsfiddle.net/8sREv/ – 2012-04-10 21:08:51

做到這一點代碼在'body'加載之前在'head'中執行？試試'$（document）.on ...'。 – zzzzBov 2012-04-10 21:08:58

它包裹在$（document）.ready ... – 2012-04-10 21:12:50

你可以這樣做：

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

，將選擇元素（。目的）至極被包裹在一個element.workItemRow

2012-04-10 21:30:08

回答