码迷,mamicode.com
首页 > 其他好文 > 详细

隐藏弹窗的情况(办法很笨拙)

时间:2018-08-28 18:57:13      阅读:167      评论:0      收藏:0      [点我收藏+]

标签:ide   alt   隐藏   内容   弹窗   遮罩层   图片   func   技术分享   

情况一:遮罩层包含了全部内容(点击事件源,以及用来排除的位置)

html:

 技术分享图片

js:

$(".mark").on("click", function(e) { //点击灰色区域关闭模态
        
    if(e.target == $(".mark")[0]) {
        $(".mark").hide();//需要关闭的弹窗
    }
    e.stopPropagation();
});

 

 

情况 二:遮罩层与事件源不在同一容器内

html:

技术分享图片

 

js:

$(document).on("click", function(e) { 
  //齿轮及选项外关闭操作面板
    if(e.target != $(".btn")[0] && e.target != $(".item")[0]) {
  //若点击以上2处以外的地方,则关闭弹窗
    $(".panel").hide();//弹窗容器
    }
    e.stopPropagation();
});

 

 目前也只会这样程度的,办法很死,若有人有灵活的办法,欢迎赐教。

 

隐藏弹窗的情况(办法很笨拙)

标签:ide   alt   隐藏   内容   弹窗   遮罩层   图片   func   技术分享   

原文地址:https://www.cnblogs.com/JaneBlog/p/9549998.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!