JS addeventlistener点击父母不是孩子

Question

我有父母和孩子的父母是扩大/盒子和孩子的女巫还点击处理其他处理如何让父母不活跃点击时孩子被束缚？

这是父：

$('#'+groupId)[0].addEventListener("click", collapseExpand); 


<div id="title_group0">smth (1)<img id="coltitle_group0" src="chrome-extension://.../images/collapse.png" collapsed="yes" title="Show Divvies in this box" class="boxButton"><img src="chrome-extension://.../images/wrench_icon&amp;16.png" id="boxSettingsButton0" title="Settings" class="boxButton"><img style="display:none;" src="chrome-extension://.../images/sort_a.png" id="sorting_desc_asctitle_group0" class="sortIcon"><b style="display:none;" class="sortType">ABC</b></div> 

Answer 1

您stop propagation（取消鼓泡）的点击：

$('#'+groupId)[0].addEventListener("click", function(e) { 
    e.stopPropagation(); 
    collapseExpand(e); // You can omit the `e` if the function doesn't need it 
}); 

通过孩子的事件处理程序中这样做，可以防止父元素从看到的点击。

---

旁注：你似乎是半使用jQuery。要充分利用它：

$('#'+groupId).on("click", function(e) { 
    e.stopPropagation(); 
    collapseExpand(e); // You can omit the `e` if the function doesn't need it 
}); 

Answer 2

我想你可以尝试使用event.stopPropagation()这样的：

$('#'+groupId).click(function(event){ 
    collapseExpand() 
    event.stopPropagation() 
}); 

这将阻止事件的传播。

Answer 3

$('.foobar').on('click', function(e) { 
    if (e.target !== this) return; 

    alert('clicked the foobar'); 
}); 

尝试这个 -

http://jsfiddle.net/eaVzx/165/