如何检测外点击两大块

我jQuery代码是：

$(document).ready(function() { 
    $('.js-bottom-navbar__consultant').click(function() { 
     $('.bottom-navbar__consultant-content').toggleClass('navbar__consultant-content--opened'); 
    });

这部分检测点击甚至在子元素，WO它不工作

$(document).on('click', function(e) { 
     if ($(e.target).is('.js-bottom-navbar__consultant') === false) { 
      $('.bottom-navbar__consultant-content').removeClass('navbar__consultant-content--opened'); 
     } 
    }); 
});

HTML

<div class="js-bottom-navbar__consultant bottom-navbar__consultant"> 
    <p>Some text too</p> 
    <p class="js-consultant__button consultant__button consultant__button--online">    <span class="button__text--desktop">Some text</span> 
    </p> 
</div> 
<div class="bottom-navbar__consultant-content navbar__consultant-content "> 
    <div class="consultant__details consultant__status--online consultant__status"> 
    <img class="consultant__img" src=""> 
    <div class="consultant__text"> 
     <p class="consultant__name"> 
     Name 
     </p> 
     <p class="consultant__specification"> 
     Specification 
     </p> 
     <a href="#" class="consultant__question"> 
     Start 
     </a> 
    </div> 
    </div>  
</div>

Jsfiddle

来源

2017-03-15 Angelzzz

请包括相关的HTML。现在，您的问题/代码段引用了我们一无所知的元素和“块”。 – Santi

我加的jsfiddle，堆栈不允许张贴问题，以大量的代码http://jsfiddle.net/g8f9Lzcw/1/ – Angelzzz

首先，你的HTML并不长。但更重要的是，Stack允许使用最短的代码量 - 如果最短的数量是100行，那就这样吧。没有什么说“Stack不允许大量代码”。 – Santi

我已经完成了good deal of work探索单击外部元素。还有一个fairly lengthy answer-thread通过一些方法。我给你找到两个元素的具体问题的解决办法是这样的：

document.body.addEventListener('click', function(e){ 
    if(!element1.contains(e.target) && !element2.contains(e.target)){ 
     //do the work here 
    } 
});

凡element1和element2是要检查的点击是外部的因素。

来源

2017-03-15 15:12:09

如何检测外点击两大块

回答

相关问题