jQuery除指定区域外点击任何地方隐藏DIV功能


Posted in jQuery onNovember 13, 2017

具体代码如下所示:

$('body').click(function(e) {
  var target = $(e.target);
  // 如果#overlay或者#btn下面还有子元素,可使用
  // !target.is('#btn *') && !target.is('#overlay *')
  if(!target.is('#btn') && !target.is('#overlay')) {
    if ( $('#overlay').is(':visible') ) { 
      $('#overlay').hide();                          
    }
  }
});

或者

$('body').click(function(e) {
  if(e.target.id != 'btn' && e.target.id != 'overlay')
   if ( $('#overlay').is(':visible') ) {
     $('#overlay').hide();
   }
})

PS:下面在接着看一段代码jquery 点击除本身外其他地方隐藏

$("#test").click(function(e) { 
  e?e.stopPropagation():event.cancelBubble = true; 
}); 
$(document).click(function() { 
  $("#test").fadeOut(); 
<pre name="code" class="html">e?e.stopPropagation():event.cancelBubble = true;  为阻止冒泡事件</pre> }); 
<pre></pre> 
<br> 
<link rel="stylesheet" href="http://static.blog.csdn.net/public/res-min/markdown_views.css?v=2.0">

总结

以上所述是小编给大家介绍的jQuery除指定区域外点击任何地方隐藏DIV,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

jQuery 相关文章推荐
jQuery插件FusionCharts绘制ScrollColumn2D图效果示例【附demo源码下载】
Mar 22 jQuery
jQuery导航条固定定位效果实例代码
May 26 jQuery
如何将 jQuery 从你的 Bootstrap 项目中移除(取而代之使用Vue.js)
Jul 17 jQuery
jQuery EasyUI的TreeGrid查询功能实现方法
Aug 08 jQuery
React中jquery引用的实现方法
Sep 12 jQuery
jQuery结合jQuery.cookie.js插件实现换肤功能示例
Oct 14 jQuery
jquery实现二级导航下拉菜单效果实例
May 14 jQuery
jQuery实现的记住帐号密码功能完整示例
Aug 03 jQuery
jQuery利用cookie 实现本地收藏功能(不重复无需多次命名)
Nov 07 jQuery
JQuery样式与属性设置方法分析
Dec 07 jQuery
JQuery表单元素取值赋值方法总结
May 12 jQuery
JavaScript枚举选择jquery插件代码实例
Nov 17 jQuery
jQuery实现checkbox即点即改批量删除及中间遇到的坑
Nov 11 #jQuery
浅谈jquery中ajax跨域提交的时候会有2次请求的问题
Nov 10 #jQuery
js与jQuery实现的用户注册协议倒计时功能实例【三种方法】
Nov 09 #jQuery
jQuery.Sumoselect插件实现下拉复选框效果
Nov 09 #jQuery
jQuery实现动态添加节点与遍历节点功能示例
Nov 09 #jQuery
简单实现jquery隔行变色
Nov 09 #jQuery
jQuery实现的简单无刷新评论功能示例
Nov 08 #jQuery
You might like
从零开始 教你如何搭建Discuz!4.1论坛
2006/07/07 PHP
初学CAKEPHP 基础教程
2009/11/02 PHP
Linux环境下搭建php开发环境的操作步骤
2013/06/17 PHP
浅谈PHP的exec()函数无返回值排查方法(必看)
2017/03/31 PHP
Gambit vs ForZe BO3 第二场 2.13
2021/03/10 DOTA
动感效果的TAB选项卡jquery 插件
2011/07/09 Javascript
jQuery中读取json文件示例代码
2013/05/10 Javascript
js判断FCKeditor内容是否为空的两种形式
2013/05/14 Javascript
js中substr,substring,indexOf,lastIndexOf的用法小结
2013/12/27 Javascript
JavaScript基本数据类型及值类型和引用类型
2015/08/25 Javascript
使用jquery获取url及url参数的简单实例
2016/06/14 Javascript
jquery表单提交带错误信息提示效果
2017/03/09 Javascript
JavaScript实现获取远程的html到当前页面中
2017/03/26 Javascript
angular基于ng-alain定义自己的select组件示例
2018/02/23 Javascript
jquery分页插件pagination使用教程
2018/10/23 jQuery
js中对象和面向对象与Json介绍
2019/01/21 Javascript
微信小程序 wxParse插件显示视频问题
2019/09/27 Javascript
基于JavaScript实现随机点名器
2021/02/25 Javascript
[01:05]DOTA2完美大师赛趣味视频之选手教你打职业
2017/11/23 DOTA
使用Python的Flask框架来搭建第一个Web应用程序
2016/06/04 Python
利用Python为iOS10生成图标和截屏
2016/09/24 Python
python更改已存在excel文件的方法
2018/05/03 Python
python读取Excel表格文件的方法
2019/09/02 Python
Python实现基于socket的udp传输与接收功能详解
2019/11/15 Python
Python爬虫爬取煎蛋网图片代码实例
2019/12/16 Python
解决pyinstaller打包运行程序时出现缺少plotly库问题
2020/06/02 Python
python实现将中文日期转换为数字日期
2020/07/14 Python
PyCharm vs VSCode,作为python开发者,你更倾向哪种IDE呢?
2020/08/17 Python
python两个list[]相加的实现方法
2020/09/23 Python
群众路线教育实践活动心得体会
2014/03/07 职场文书
湘江北去观后感
2015/06/15 职场文书
2015年党风廉政建设个人总结
2015/08/18 职场文书
运动会广播稿200字
2015/08/19 职场文书
禁毒心得体会范文
2016/01/15 职场文书
意外事故赔偿协议书
2016/03/22 职场文书
人民币使用说明书
2019/04/17 职场文书