Question

我正在尝试添加div click事件的动作，并且我在另一个内部包含一个div。我希望每个div的点击事件不同。但是如果div被包含在另一个内部，则内部div上的click事件会执行这两个操作，例如..我添加了一个小提琴和一个示例代码。如何为每个div单独制作单独的动作？

http://jsfiddle.net/Dk8vA/

$('#outerDiv').on("click",function(){
     alert("s");    
 });

$('#innerDiv').on("click",function(){
  alert("n");
});
 <div id='outerDiv'><div id='innerDiv'></div></div>

Answer 1

使用e.stopPropagation()阻止事件冒泡到父级。

Reference Here

这可以防止事件冒泡DOM树，从而阻止任何父处理程序收到事件通知。通过添加stopPropagation（）事件不会冒泡到其父#outerDiv或更高的位置。

$('#innerDiv').on("click",function(e){
    e.stopPropagation();
alert("n");

});

Demo

Answer 2

使用event.stopPropagation()防止事件冒泡

请参阅Fiddle

$('#outerDiv').on("click",function(){
  alert("s");  
});

$('#innerDiv').on("click",function(e){
  alert("n");
  e.stopPropagation();    
});

Answer 3

使用e.StopPropagation()将是您的解决方案。

你可以参考

jQuery click() on a nested div

单独添加单击事件以封闭div

3 个答案:

Demo