Question

在里面，我有其他孩子的div。那些人也有孩子。

<div class="parent">
<div class="child_1">//children elements</div>
<div class="child_1">//children elements</div>
<div class="child_1">//children elements</div>
<div class="child_1">//children elements</div>
</div>

我想添加点击事件，当我点击父 div中的任何元素时触发，包括父 div，不包括 child_1 div和它的后代。

目前我尝试了

jQuery(".parent").not(".child_1").click(function(event) {

});

但是当我点击 child_1 div及其后代时，点击事件就会起作用。

这是什么问题？请帮忙。

更新

此处我有 child_1

的其他点击事件

jQuery(".child_1").click(function(event) {

});

Answer 1

你应该这样做。

$('.parent').on('click', function () {
  // do your stuff here
}).find('.child_1').on('click', function (e) {
  e.stopPropagation();
});

这是一个小提琴http://jsfiddle.net/BbX7D/1/

Answer 2

您仍然需要捕获要排除的元素上的点击事件，否则点击只会冒泡到.parent元素。

使用closest方法检查被点击的元素是否是属于类.child_1的元素的子元素。使用stopPropagation可防止事件冒泡：

$('.parent,.parent *').click(function(e){
  if ($(this).closest('.child_1').length > 0) {
    alert('in child_1');
  } else {
    alert('not in child_1');
  }
  e.stopPropagation();
});

演示：http://jsfiddle.net/Guffa/tETCQ/

Answer 3

我认为应该是

jQuery(".parent, .parent *").not(".child_1").click(function(event) {

});

Answer 4

试试这个（fiddle）：

（编辑+更新小提琴） 我发现了一个缺陷。此版本检查被点击的元素是否位于具有“exclude”类的元素内：

<div class="parent">
<div class="child_1 exclude">//children elements</div>
<div class="child_1">//children elements</div>
<div class="child_1">//children elements</div>
<div class="child_1">//children elements</div>
</div>

jQuery(".parent").click(function(event) 
    {
    if ($(event.target).closest('.exclude').length>0) return false; 
    alert('hi');
    });

Answer 5

这是一个古老的问题，但我想我会解决我的决议，以防其他人帮忙。

这就是我所做的。此示例使用您的标记：

$('.parent').on('click', function(e) {
    var $target = $(e.target);
    if (!$target.parents('.child_1').length && !$target.hasClass('child_1')) {
        // do what you need on the parent's click event
        // add 'e.preventDefault()' here if you need
    }
    // no need to prevent default or stop propagation here
    // this will allow click events on child elements to work
});

在div上触发点击事件，不包括一个子div和它的后代

5 个答案: