Javascript 使用：不选择除具有特定类的框内之外的所有元素

我有一个覆盖，我想隐藏在它外面的

mousedown

下面是我尝试过的，但不幸的是

：not

选择器没有像我预期的那样工作

$('body:not(.overlay)').one('mousedown',function(){
        //hide overlay here
});

我还尝试了

$（'*:not（.overlay）

，但遇到了相同的问题

即使在覆盖框内单击，覆盖也会被隐藏。请尝试.not（）函数：。它专门从选定的组中删除元素，这可能是您遇到的问题。省去了用复杂的if's等来解决这个问题

$(document).on( "mousedown.hideoverlay", function(e){
    if( $(e.target).closest(".overlay").length === 0 ) { //overlay wasn't clicked.
        //hide overlay
        $(document).off("mousedown.hideoverlay");
    }
});

$('*').not('.overlay').on('mousedown', function(){
    alert("here");
});

编辑 呵呵，没有把问题读清楚：

$(document).on('mousedown', function(e){
   var target = $(e.target);
   if(!target.parents().hasClass('overlay') && !target.hasClass('overlay')){
      // hide stuff
   }
});

编辑：我更喜欢使用单击此处（不知道为什么）：

在我看来，它看起来更好，叫我怪异…

试试.not（）函数：。它专门从选定的组中删除元素，这可能是您遇到的问题。省去了用复杂的if's等来解决这个问题

$('*').not('.overlay').on('mousedown', function(){
    alert("here");
});

编辑 呵呵，没有把问题读清楚：

$(document).on('mousedown', function(e){
   var target = $(e.target);
   if(!target.parents().hasClass('overlay') && !target.hasClass('overlay')){
      // hide stuff
   }
});

编辑：我更喜欢使用单击此处（不知道为什么）：

---

在我看来，它只是看起来更好，叫我怪异…

你的选择器

body:not（.overlay）

匹配body元素如果它没有类

overlay

，我假设你的意思是它没有类

overlay的后代：

$('body :not(.overlay)'); //note the space - descendant selector

这种赋值的问题是它匹配了太多的元素（特别是选定元素的父元素）。技术上，即使单击任何容器
div
，也会匹配选择器。发生这种情况的原因是，即使单击具有
overlay
类的元素，也会继续向上传播DOM

我同意这里的其他建议，也就是说，如果选择器不匹配，可以监听所有单击，而不执行任何操作，但是阻止事件在其上传播可能会干扰页面的其余逻辑

我更倾向于提倡一种方法，即可以单击“可覆盖”项的显式子集，并使用
：not（.overlay）
选择器过滤它们：

$('.some-generic-container-name:not(.overlay)')...

您的选择器
body:not（.overlay）
与body元素匹配如果它没有类
overlay
，我假设您的意思是没有类
overlay的它的后代：

$('body :not(.overlay)'); //note the space - descendant selector

这种赋值的问题是它匹配了太多的元素（特别是选定元素的父元素）。技术上，即使单击任何容器
div
，也会匹配选择器。发生这种情况的原因是，即使单击具有
overlay
类的元素，也会继续向上传播DOM

我同意这里的其他建议，也就是说，如果选择器不匹配，可以监听所有单击，而不执行任何操作，但是阻止事件在其上传播可能会干扰页面的其余逻辑

我更倾向于提倡一种方法，即可以单击“可覆盖”项的显式子集，并使用
：not（.overlay）
选择器过滤它们：

$('.some-generic-container-name:not(.overlay)')...

我不知道html结构。我使用的是xhtml btw..@user01他指的是什么标记@xdazz：我在JSF2.2中使用Facelets，我不知道html结构。我使用的是xhtml btw..@user01他指的是什么标记@xdazz：我在JSF 2.2中使用Facelets，你如何在事件对象上调用jQuery方法？@未定义的第百万次编辑，我认为它现在实际上是正确的…现在这样做还为时过早：（你如何在事件对象上调用jQuery方法？@未定义的第百万次编辑，我认为它现在实际上是正确的…现在这样做还为时过早：（使用最近的（）让我明白了+1，虽然为了避免歧义，如果它不检查
Simple==条件应该足够了，它会比检查类型相等快一点。谢谢，这是有效的。但是如果你能澄清的话，为什么我的选择器不起作用？@user01 o.v.刚刚回答了那部分…看看他的回答，最近（）我得到了+1，虽然为了避免歧义，如果它不检查
Simple==条件应该足够了，它会比检查类型相等快一点。谢谢，这是有效的。但是如果你能澄清的话，为什么我的选择器不起作用？@user01 o.v.刚刚回答了那部分…看看他的答案