0

我正在尝试解决一些困境,有一点问题。

因此,我想跟踪页面上的所有点击,并且仅在 e.target 不是某些元素的子元素时才执行某些操作。所以我有:

 jQuery('body').click(function(e){
     // some stuff
     // do some more stuff
         if(!(jQuery('#element1, #element2, #element3').find(e.target))){
             // do something extra here ONLY if the target is NOT a child
             // of any of those elements
         }

 })

这似乎不起作用。我尝试了一些其他的方法来获得“找不到”的氛围,ala,.not,!()等......不能。似乎忽略了整个代码。即使我做了一个简单的:只是为了测试:

      // I expressly click outside this area of element1, still captures it.
     if(jQuery('#element1').find(e.target)){
         console.log('in')
         e.stopPropagation();
     // failes
4

2 回答 2

4

有几种方法可以解决这个问题。最小的更改是附加.length到您的条件:

if(!jQuery('#element1, #element2, #element3').find(e.target).length) {
    // do something extra here ONLY if the target is NOT a child
    // of any of those elements
}

没有.length条件将始终为假,因为 jQuery 对象是一个真实值,即使它不包装任何 DOM 元素。

更好的方法可能是向后进行检查:与其从目标元素散开并遍历所有 DOM(这可能意味着访问数百个后代),不如简单地遍历目标的父元素(这将是一个很大的较小的数字)而不是?

if(!$(e.target).parents().filter('#element1, #element2, #element3').length) {
    // do stuff
}

第三种方法是在您感兴趣的元素上安装一个单独的点击处理程序,并使用它来阻止点击事件冒泡<body>

$('#element1, #element2, #element3').click(function(e){
    e.stopPropagation();
});

这样你就不需要原始处理程序中的条件,但我不喜欢这样做,因为它在处理程序之间引入了乍一看看起来无关的“微妙”依赖关系。

于 2013-10-01T09:21:09.507 回答
2

我想你搜索jQuery.parents(selector)文档 jQuery

$('body').click(function(e) {
   if (e.target.parents(<selector>).length == 0) {
     // Not child of selected parent => do something
   }
});
于 2013-10-01T09:21:25.460 回答