美文网首页
js点击空白处关闭弹窗

js点击空白处关闭弹窗

作者: lesdom | 来源:发表于2019-07-26 16:50 被阅读0次

    代码

    1. 点击事件的对象不是目标区域本身
    2. 事件对象同时也不是目标区域的子元素

    js

    contains() : 判断DOM元素的包含关系

    document.addEventListener("click", event => {
      var cDom = document.querySelector("#popupWindow");
      var tDom = event.target;
      if (cDom == tDom || cDom.contains(tDom)) {
        // ... 
      } else {
        // 关闭弹窗
      }
    });    
    

    jQuery

    $(document).mouseup(function(e){
      var _con = $(' 目标区域 ');   // 设置目标区域
      if(!_con.is(e.target) && _con.has(e.target).length === 0){
        // 关闭弹窗
      }
    });
    

    网站导航

    网站导航

    相关文章

      网友评论

          本文标题:js点击空白处关闭弹窗

          本文链接:https://www.haomeiwen.com/subject/lhydrctx.html