javascript - js如何获取一个div以外的所有地方？

问题描述

问 题

<ul>
    <li></li>
    <div class="a" id="second-tag-div1">
        <div class="b"></b>
    </div>
</ul>

这里有个js，点击 li 元素，ul 增加 class，a 增加class，b增加class， 如何获取a以外的所有地方，这个好像阻止冒泡不合适，应该点击其他地方 remove掉增加的class。

// 关闭弹窗

$(document).mouseup(function(e){
    var _con = $('#second-tag-div1');   // 设置目标区域
          if(!_con.is(e.target) && _con.has(e.target).length === 0){ 
            $('.secondary-tag-container').removeClass('second-tag-div-active');
            $('.sidebar').removeClass('z-index100');
            $('.secondary-content').removeClass('display-block');
      };
});

其实这样已经达到了点击目标区域之外的地方关闭弹窗，只不过，因为点击li，然后对应增加class,当开启弹窗的时候，再点击li,完成了一次关闭弹窗又再次打开的操作，所以看上去点击当前对应li无效。

现在该怎么修改，它不是冲突，也不是错误，是运行了关闭操作，接着运行了打开操作。

解决方案

可以看一下类似的问题：
点击空白关闭弹窗的js写法推荐？ https://segmentfault.com/q/1010000000452...

下面是我自己写的, 判断是否点击的不是目标元素或目标元素的后代元素

document.onmouseup = function(e){
    var e = e || window.event;
    var target = e.target || e.srcElement;
    var _tar = //获取你的目标元素
    //1. 点击事件的对象不是目标区域本身
    //2. 事件对象同时也不是目标区域的子元素
    if( !(target == _tar) && ! _tar.contains(target) ){
        //你的功能
    } else {
        //你的功能
    }
}

这篇关于javascript - js如何获取一个div以外的所有地方？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！