I created project demo from here
当我双击子元素时,父元素将同时触发。我不想在父触发器的元素上双击事件,所以有人可以帮助我吗?感谢
<style>
#parent {
width: 200px;
height: 200px;
position: relative;
border: 1px solid black;
}
#parent:hover {
cursor: pointer;
background: green;
}
#children {
width: 100px;
height: 100px;
position: absolute;
top: 10px;
left: 10px;
border: 1px solid black;
}
#children:hover {
cursor: pointer;
background: blue;
}
</style>
<div id="parent">
<div id="children"></div>
</div>
<script>
$('#children').dblclick(function () {
alert('children');
});
$('#parent').dblclick(function () {
alert('parent');
});
</script>
答案 0 :(得分:1)
你需要使用event.stopPropagation();对于儿童元素。
$('#children').dblclick(function (event) {
event.stopPropagation();
alert('children');
});
您可以通过以下链接了解详情。 http://javascript.info/tutorial/bubbling-and-capturing