Question

我有一个简单的场景：我在另一个内部有两个div，我希望当我点击子div时，只有子div调用，当我点击父对象时调用，但在下面的示例中，您可以看到我点击了两个孩子都被调用了。这是我的代码：

$(document).ready(function(){

$("#t1").click(function(){alert("Parent")});
 $("#t2").click(function(){alert("child")});

}）;

http://jsfiddle.net/hminaee/hv6dv/

任何人都可以帮忙吗？

Answer 1

您应该使用event.stopPropagation()阻止事件冒泡DOM树（任何父处理程序不被通知事件）。尝试：

$(document).ready(function(){
    $("#t1").click(function(){alert("Parent")});
     $("#t2").click(function(e){e.stopPropagation();alert("child")});
});

<强> DEMO

Answer 2

您需要在此处使用 e.stopPropagation() 来防止点击事件冒出您孩子div #t2到父div #t1

的DOM树

$("#t2").click(function(e){
    e.stopPropagation(); 
    alert("child")
});

<强> Updated Fiddle

当我点击div元素中的child时，如何才能调用child

2 个答案: