关于点击空白关闭弹窗的js写法推荐?

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了关于点击空白关闭弹窗的js写法推荐?相关的知识,希望对你有一定的参考价值。

$(document).mouseup(function(e){
  var _con = $( 目标区域 );   // 设置目标区域
  if(!_con.is(e.target) && _con.has(e.target).length === 0){ // Mark 1
    some code...   // 功能代码
  }
});
/* Mark 1 的原理:
判断点击事件发生在区域外的条件是:
1. 点击事件的对象不是目标区域本身
2. 事件对象同时也不是目标区域的子元素
*/
$el_box = $(.box);//弹出层
$el_box.click(function(e){
e.stopPropagation();//阻止弹出层的click事件,防止冒泡到body
});

$(document).one(click,function(e){//我的弹出层元素是动态载入的,使用过后就销毁了,所以用了one,可以使用bind
$el_box.remove();
});

 

以上是关于关于点击空白关闭弹窗的js写法推荐?的主要内容,如果未能解决你的问题,请参考以下文章

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

桌面广告弹窗如何关闭 关掉你最讨厌的广告弹窗的方法

使用js冒泡实现点击空白处关闭弹窗

JS中关闭弹窗的问题

vue 如何设置点击空白处的遮罩层关闭弹窗

react 父传子 弹窗的显示或关闭