jQuery点击自身以外地方关闭弹出层

最新推荐文章于 2020-07-16 16:29:33 发布

weixin_33670713

最新推荐文章于 2020-07-16 16:29:33 发布

阅读量145

点赞数

文章标签： javascript python ViewUI

原文链接：https://my.oschina.net/meng527/blog/476926

版权

2019独角兽企业重金招聘Python工程师标准>>>

主要功能是点击显示,然后通过点击页面的任意位置都能关闭显示效果,主要是$(document).click的作用

开发过程中经常有一些弹出层,弹出后要在点击页面其他地方时自动关闭,下面是实现代码:
HTML代码：

<div class="down">click</div>
<div class="con hide">show-area</div>

CSS代码：

.hide{display:none;}

JS代码：

$(document).ready(function(){
 $("div.down").click(function(e){
   e.stopPropagation();
   $("div.con").removeClass("hide");
 });
 $(document).click(function(){
   if(!$("div.con").hasClass("hide")){
      $("div.con").addClass("hide");
   }
 });
});

转载于:https://my.oschina.net/meng527/blog/476926