jQuery事件stopPropagation不适用于自定义事件
<!DOCTYPE html>
<html>
<head>
<script src="jquery-2.1.1.min.js" type="text/javascript"></script>
</head>
<body>
<div id="outer">
<div id="inner">
</div>
</div>
<script type="text/javascript">
$("#outer").on("myevent", function(event) {
alert(event.target.id);
event.stopPropagation();
return false;
});
$("div").trigger("myevent");
</script>
</body>
</html>在上面的代码中，我预计事件myevent将由outer div处理一次。但我看到了两个警报：outer和inner。为什么stopPropagation在这里不工作，以及如何防止将自定义事件传播给子事件？
编辑:我想在全球范围内触发事件，比如$("div").trigger("myevent");，但是我只想在订阅它的地方处理它。
回答 3
Stack Overflow用户
发布于 2014-07-09 13:35:12
与在$('#outer').on('myevent')上使用$('#outer').on('myevent')不同，您需要在单独的处理程序中的每个div元素上使用它：
$("#outer").on("myevent", function(event) {
console.log(event.target.id);
return false;
});
$('div').on('myevent', function(event) { // or $('*').on('myevent', ...
event.stopPropagation();
});
$("div").trigger("myevent"); // only logs 'outer'Stack Overflow用户
发布于 2014-07-09 12:55:58
$("div").trigger("myevent");相当于：
$("div").each(function() {
$(this).trigger("myevent");
});因为jQuery会自动循环所有匹配选择器的元素。因此，它在内部和外部分别触发事件。
当它在内部DIV上触发它时，那里没有处理程序，所以没有什么可以阻止事件从外部DIV冒泡。
为了防止这种情况发生，您应该更具体地说明正在触发的元素：
$("#outer").trigger("myevent");Stack Overflow用户
发布于 2014-07-09 12:56:08
您将收到两个警告，因为您在div上触发了div，因此它将应用于html中可用的所有div。在本例中，您有内部和外部div，它一个一个地触发myevent。
要在外部div上触发myevent，请使用：
$("div#outer").trigger("myevent");https://stackoverflow.com/questions/24654180
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号