觀察具有獨立點擊觀察功能的元素內的元素點擊

我有另一個元素內的元素，並且都具有單獨的點擊功能。我想要做的是忽略或停止父元素，如果子元素具有點擊功能。例如：觀察具有獨立點擊觀察功能的元素內的元素點擊

<div class="parent"> 
    <div class="child1">Child Click Function</div> 
    Parent Click Function 
</div> 
<script type="text/javascript"> 
document.observe('dom:loaded',function(){ 
    if ($$('.parent') != undefined) { 
     $$('.parent').invoke('observe','click', function(e) {  
     alert('parent');   
     }); 
    } 
    if ($$('.child1') != undefined) { 
     $$('.child1').invoke('observe','click', function(e) {  
     alert('child');   
     }); 
    }   
}); 
</script>

什麼情況是，當點擊child1時，無論是和家長被觸發，因爲child1是父之內。我想在選擇子項時禁用/停止觀察，但是當您在父項內部單擊其他任何項時，它將按照它應該的方式工作。

謝謝。

來源

2012-01-26 fanfavorite

哇 - 原型。 –

您遇到了所謂的「事件冒泡」。除非您明確停止冒泡，否則給定元素上的事件會使DOM膨脹直到達到根節點。因爲它看起來像你使用的原型，更新你的孩子的事件處理程序下面應該做的伎倆：

$$('.child1').invoke('observe','click', function(e) {  
    Event.stop(e);  
    alert('child');   
});

http://api.prototypejs.org/dom/Event/prototype/stop/

來源

2012-01-26 21:34:22 Amit

有趣。我認爲Event.stop（e）/e.stop（）僅適用於元素。似乎很好。謝謝。 – fanfavorite

我不知道哪一個工程，但我通常使用兩種：

if (event.cancelBubble) 
    event.cancelBubble(); 
if (event.stopImmediatePropagation) 
    event.stopImmediatePropagation();

而且click事件傳遞到的onclick功能。

來源

2012-01-26 21:31:14 Travesty3

感謝Travesty。看起來這樣也會起作用。 – fanfavorite

都停止傳播並取消泡泡將停止事件的傳播都在一起，從我得到的是你想繞過與父母關聯的事件。如果孩子被點擊，我會建議在父母上使用.unbind（）。例如，

(CHECK CHILD CLICK) { 
$('.parent').unbind('click');}

來源

2012-01-26 21:53:52 Rahul

我相信是jQuery。這與原型中的stopObserving類似，但這種方法的問題在於，當再次單擊父項時，需要將點擊觀察重新放入。 – fanfavorite

觀察具有獨立點擊觀察功能的元素內的元素點擊

回答

相關問題