父母和子女的點擊事件

我有一個父子元素DIV有子元素div元素。我爲父母及其子女單獨實施了點擊實施。父母和子女的點擊事件

<div id="mainContainer"> 

    <div id="childContainer">  
    </div> 

    <div id="childContainer2"> 
    </div> 

</div> 

$('#mainContainer').click(function() { 

     console.log('main container'); 

    }).children().click(function() { 
     console.log('childen'); 
     return false; 
    }); 

    $('#childContainer2').click(function() { 

     console.log('child container 2'); 

    });

這工作正常。但如果我點擊一個孩子，那麼這個事件會運行兩次，這是它應該如何工作的。我的問題是 - 有沒有一種方法，我可以明確地寫入事件父母，不會影響兒童，使兒童不需要執行兩次點擊功能？

來源

2013-12-13 KrishnaDhungana

對不起，你能再解釋一下你需要什麼 –

你的預期結果是什麼http://jsfiddle.net/arunpjohny/hF6L9/1/ –

你正在綁定兩個事件處理程序給第二個孩子。你只想運行其中一個，如果是，哪一個？您可能正在尋找'event.stopImmediatePropagation'：http://api.jquery.com/event.stopImmediatePropagation/。 –

是的，你可以只，更改綁定的事件順序，並停止傳播使用stopImmediatePropagation

考慮這個fiddle

$('#childContainer2').click(function (e) {  
     alert('child container 2'); 
     e.stopImmediatePropagation() 
    return false; 
    }); 
$('#mainContainer').click(function() { 
alert('main container'); 

    }).children().click(function (e) { 
     alert('childen'); 
     return false; 
    });

來源

2013-12-13 07:25:47

您可以根據event.stopPropagation：

children().click(function (e) { 
    e.stopPropagation(); 
    console.log('childen'); 
    return false; 
});

防止事件佈雷最多

來源

2013-12-13 07:20:40 Felix

這兩個return false; & event.stopPropagation停止事件傳播給父母。

這是demo fiddle。

來源

2013-12-13 07:26:59

父母和子女的點擊事件

回答

相關問題