Jquery - 仅在顶部顶层而不是两者上触发点击事件

Question

点击Child时，Parent和Child正在点击alert。

当我点击它时，我可以只将Child发送到警报吗？

<div id="Parent" style="width:300px;height:100px;border:solid 1px red;">
    Parent
    <div id="Child" style="width:300px;height:50px;border:solid 1px green;">
        Child
    </div>
</div>

<script>
$(document).ready(function(){
    $("#Child").click(function(){alert('child')})
    $("#Parent").click(function(){alert('Parent')})
})
</script>

http://jsfiddle.net/WAYgL/ 如果您在Child上单击此示例，则会触发两个警报，如何阻止Parent发出提醒

Answer 1

您可以调用事件对象的stopPropagation方法：

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

这会阻止事件冒泡DOM树（这是DOM事件默认行为的方式）。