父母和子女的点击事件

我有一个父子元素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

父母和子女的点击事件

回答

相关问题