jquery - 如果单击某个孩子，如何防止单击功能？

Question

小提琴

由于某种原因，函数not()中on()的 不起作用。我只希望在单击 aqua section（父）元素时运行该函数，如果单击灰色div（子）元素，则不执行任何操作。

jQuery：

$('body').append('<section><div class="someClass"></div><section>');

$('body').on('click', 'section:not(".someClass")', function(){
    alert('Aqua not gray clicked.');
});

section另外，为什么单击 aqua 元素时会弹出两次警报？

Answer 1

部分和后代选择器之间会有空间:not，您可能需要没有，因为预期元素是部分的后代。有了空间，它会看起来没有 class 的部分someclass。

$('body').on('click', 'section :not(:has(.someClass))', function(){
    alert('Aqua not gray clicked.');
});

您可以将事件绑定到部分，并通过在处理程序中为具有类 someclass 的后代的部分传递代码的执行。

$('body').on('click', 'section', function(){
    if($(this).find('.someClass').length > 0) return;
    alert('Aqua not gray clicked.');
});

Answer 2

You need to check whether the actual element that was clicked (e.target) has that class:

if ($(e.target).hasClass('someClass')) return;