一種消除元素單擊事件的方法

Question

我有一個元素#foo，它有點擊事件。元素#foo位於元素#bar中，該元素上也有點擊事件。

<div id="bar"> 
    <div id="foo" /> 
</div> 

當點擊#foo，#bar事件被調用和#foo事件被忽略。這就是我想要的。

我正在尋找一種方式來刪除#foo元素的所有點擊事件，除了我剛剛設置的事件和一切都在父母#foo事件。

編輯：這裏是jsFiddle demo。我想在第一場比賽之前打第二場比賽。

編輯＃2：這裏是my code with your suggestions。不起作用。

Answer 1

如果您對富點擊事件，你不希望它的泡沫，你可以做到以下幾點：

$("#foo").on('click', function(e){ 
    e.preventDefault(); 
    e.stopPropagation(); //this line will stop the click bubbling up the tree. 
}); 

Answer 2

試試這個

$('#foo').click(function(e){ 
    e.preventDefault(); 
    e.stopPropagation(); 
    $('#bar').trigger('click'); 
}); 

Answer 3

使用stopPropagation功能，看一個例子：

$("#foo").click(function(e) { 
    e.stopPropagation(); 
})