Question

有两个部分targetDiv1和targetDiv2（未嵌套）。另一部分collapsibleDiv。我需要在元素targetDiv2外部点击时运行一个函数（可以折叠div）;但单击targetDiv1时不应触发该功能。使用下面的代码，我无法实现这一点..任何帮助都会很棒......

$(document).click(function(e) { 
    if(!$(e.target).closest('.targetDiv1').length && !$(e.target).is('.targetDiv1')) {
        $('.collapsibleDiv').slideDown();
    }
});

根据@Kweiss https://jsfiddle.net/vn8gmu8g/

的回答，JSFiddle

Answer 1

您希望功能在Div1或Div2之外的点击上执行，但您的代码仅排除Div1。只需添加Div2。

echo php_uname();
echo PHP_OS;

将$(document).click(function(e) { var $target = $(e.target); if(!$target.closest('.targetDiv1').length && !$target.hasClass('targetDiv1') && !$target.closest('.targetDiv2').length && !$target.hasClass('targetDiv2')) { $('.collapsibleDiv').slideDown(); } });保存在变量中并使用e.target将使您的代码更快。

Answer 2

  $(".targetDiv2").click(function(){
           $('.collapsibleDiv').slideDown();
  })

它做你想要的。单击div2时会崩溃。

Answer 3

试试这个：如果div2的条件

，你必须添加相同的内容

$(document).click(function(e) {
    var $clickedElement = $(e.target); 
    if(!$clickedElement.closest('.targetDiv1').length && !$clickedElement.is('.targetDiv1') && !$clickedElement.closest('.targetDiv2').length && !$clickedElement.is('.targetDiv2')) {
        $('.collapsibleDiv').slideDown();
    }
});

Answer 4

我创建了一个demo，我想说，它正在运作......

$(document).click(function(e) { 
    if(!$(e.target).closest('.targetDiv1').length && !$(e.target).is('.targetDiv1')) {
        $('.collapsibleDiv').slideDown();
        alert("OK");
    }
});

如果您点击targetDiv1 - ＆gt;没有任何反应

如果您点击targetDiv2 - ＆gt;警报

如果您点击其他任何地方 - ＆gt;警报

我想说，这就是你所描述的。

Answer 5

下面应该有效

$(document).click(function(e) { var target = $(e.target); if(!target.hasClass('.targetDiv1') && !target.hasClass('.targetDiv2')) { // perform you operation } });

Jquery在多个div /元素外单击

5 个答案: