[英]How to stop a parent's click event when the child's mousedown event is fired
如标题所述,当孩子的mousedown事件被触发时,我想停止父母的click事件。
我的HTML代码如下所示
<div class='parent'>
<div class='child'></div>
</div>
我的jQuery代码看起来像这样
$('.child').mousedown(function(){
//what can I write here to prevent parent's click event from fireing?
//I've tried event.stopPropagation() as well as
//event.stopImmediatePropagation() already
});
$('.parent').on('click',function(){...})
鼠标事件以这种方式触发
鼠标向下
请点击
鼠标向上
mousedown
处理程序中的event.stopPropagation()仅影响mousedown
事件。 您可以尝试以下解决方法:
var mdFaired = false; $('.parent').click(function(e) { if(!mdFaired) { var counter = $(this).children('.counter'); var count = parseInt(counter.text()); counter.text(++count); } else { mdFaired = false; } }); $('.child').mousedown(function(e) { e.stopPropagation(); mdFaired = true; var counter = $(this).children('.counter'); var count = parseInt(counter.text()); counter.text(++count); });
div { border: 1px solid black; padding: 5px; } .parent { width: 300px; height: 300px; } .child { width: 50%; height: 50%; margin: 50px auto; }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class='parent'> <span class="counter">0</span> <div class='child'> <span class="counter">0</span> </div> </div>
e.stopPropagation();
e.preventDefault();
e是从函数调用传递的事件。
应该做到的。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.