:not(）on click事件仍在激发

:not() on click event still firing

本文关键字：事件 click not on      更新时间：2023-09-26

我有以下示例结构：

<div class="modHolder">
  <div id="wData">...</div>
</div>

我希望单击.modHolder会发生一些事情，但单击#wData不会发生任何事情。

这就是我正在尝试的，但#wData仍然对点击做出反应：

$(document).on('click', '.modHolder:not("#wData"), .modClose', function(e) {
...
}

有什么想法吗？

以下是如何做到这一点，使用它来点击.modHolder:

$(document).on('click', '.modHolder, .modClose', function(e) {
    ...
});

然后加上这个：

$(document).on('click', '#wData', function(e) {
    e.stopPropagation();
});

这将停止clickEvent弹出DOM树。

点击此处查看：JSFiddle

您的选择器错误。尝试更换

'.modHolder:not("#wData")'

带有

'.modHolder div:not("#wData")'

这是一把小提琴：

http://jsfiddle.net/muywo9qp/

它应该是：

$(document).on('click', '.modHolder', function(e) { ... });
$(document).on('click', '#wData', function(e) {
    e.stopImmediatePropagation();
});


$(document).on('click', '.modHolder', function(e) { 
  alert('Here');
});
$(document).on('click', '#wData', function(e) {
  e.stopImmediatePropagation();
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="modHolder">
  <div id="wData">.....</div>
  <div class="modClose">X</div>
</div>

相关文章：