我有一个DIV与一个分类的foobar,和一些DIV内的DIV是未分类的,但我认为他们继承了foobar类:

$('.foobar').on('click', function() { /*...do stuff...*/ });

我希望它只在点击DIV的某个地方时发射,而不是在它的子DIV上。


当前回答

如果您不介意只针对较新的浏览器,还有另一种方法。只需要添加CSS

pointer-events: none;

到您想要捕获点击的div的任何子div。这是支持表

http://caniuse.com/#feat=pointer-events

其他回答

如果你不能使用指针事件:none;并且针对现代浏览器,你可以使用composedPath来检测对对象的直接点击,如下所示:

element.addEventListener("click", function (ev) {
    if (ev.composedPath()[0] === this) {
        // your code here ...
    }
})

你可以在这里阅读关于composedPath的更多信息: https://developer.mozilla.org/en-US/docs/Web/API/Event/composedPath

你可以使用event. currentarget。它只会点击得到事件的元素。

目标= e => 控制台日志(e . currentTarget); 的; <ul onClick={target}类 < li > < p > <i类 < / p > < / li > < /德>

我有同样的问题,并提出了这个解决方案(基于其他答案)

 $( ".newsletter_background" ).click(function(e) {
    if (e.target == this) {
        $(".newsletter_background").hide();
    } 
});

基本上,如果目标是div则运行代码否则什么都不做(不要隐藏它)

我没有得到工作的公认答案,但这似乎做的把戏,至少在香草JS。

if(e.target !== e.currentTarget) return;

你可以用冒泡来帮助自己:

$('.foobar').on('click', function(e) {
    // do your thing.
}).on('click', 'div', function(e) {
    // clicked on descendant div
    e.stopPropagation();
});