编程 Javascript

基于jquery点击自以外任意处，关闭自身的代码

Posted in Javascript onFebruary 10, 2012

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"); 
} 
}); 
});

基于jquery点击自以外任意处，关闭自身的代码

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

Jquery操作Select 简单方便一个js插件搞定

Nov 12 Javascript

js原生appendChild的bug解决心得分享

Jul 01 Javascript

jquery等待效果示例

May 01 Javascript

jquery.cookie.js使用指南

Jan 05 Javascript

JavaScript获取页面中第一个锚定文本的方法

Apr 03 Javascript

浅析javascript异步执行函数导致的变量变化问题解决思路

May 13 Javascript

详解JavaScript中双等号引起的隐性类型转换

May 30 Javascript

利用浮层使select不可选的实现方法

Dec 03 Javascript

微信小程序动画的简单实例

Oct 12 Javascript

对angular 监控数据模型变化的事件方法$watch详解

Oct 09 Javascript

Vue.js获取手机系统型号、版本、浏览器类型的示例代码

May 10 Javascript

vue中控制mock在开发环境使用,在生产环境禁用方式

Apr 06 Vue.js

jqPlot 图表中文API使用文档及源码和在线示例

Feb 07 #Javascript

jquery中的mouseleave和mouseout的区别模仿下拉框效果

Feb 07 #Javascript

jquery 操作日期、星期、元素的追加的实现代码

Feb 07 #Javascript

jQuery插件原来如此简单 jQuery插件的机制及实战

Feb 07 #Javascript

jQuery之end()和pushStack()使用介绍

Feb 07 #Javascript

详解强大的jQuery选择器之基本选择器、层次选择器

Feb 07 #Javascript

JavaScript 5 新增 Array 方法实现介绍

Feb 06 #Javascript

You might like

PHP中ini_set和ini_get函数的用法小结

2014/02/18 PHP

整理php防注入和XSS攻击通用过滤

2015/09/13 PHP

PHP函数引用返回的实例详解

2016/09/11 PHP

php之header的不同用法总结(实例讲解)

2017/11/28 PHP

PHP实现简单用户登录界面

2019/10/23 PHP

JavaScript DOM 添加事件

2009/02/14 Javascript

jquery 简单导航实现代码

2009/09/11 Javascript

js/ajax跨越访问-jsonp的原理和实例(javascript和jquery实现代码)

2012/12/27 Javascript

js日期时间补零的小例子

2013/03/05 Javascript

javascript按位非运算符的使用方法

2013/11/14 Javascript

Node.js中AES加密和其它语言不一致问题解决办法

2014/03/10 Javascript

动态读取JSON解析键值对的方法

2014/06/03 Javascript

jQuery实现立体式数字滚动条增加效果

2016/12/21 Javascript

微信小程序组件 contact-button（客服会话按钮）详解及实例代码

2017/01/10 Javascript

详解微信小程序设置底部导航栏目方法

2017/06/29 Javascript

angularjs路由传值$routeParams详解

2020/09/05 Javascript

vue实现树形菜单效果

2018/03/19 Javascript

关于Vue项目跨平台运行问题的解决方法

2018/09/18 Javascript

vue实现同一个页面可以有多个router-view的方法

2018/09/20 Javascript

js实现动态添加上传文件页面

2018/10/22 Javascript

微信小程序学习笔记之跳转页面、传递参数获得数据操作图文详解

2019/03/28 Javascript

vue响应式更新机制及不使用框架实现简单的数据双向绑定问题

2019/06/27 Javascript

使用python的pandas库读取csv文件保存至mysql数据库

2018/08/20 Python

pyqt5 lineEdit设置密码隐藏,删除lineEdit已输入的内容等属性方法

2019/06/24 Python

Python图像处理库PIL的ImageFilter模块使用介绍

2020/02/26 Python

python递归调用中的坑:打印有值, 返回却None

2020/03/16 Python

python 模拟登陆github的示例

2020/12/04 Python

Python将QQ聊天记录生成词云的示例代码

2021/02/10 Python

英国在线汽车和面包车零件商店：Car Parts 4 Less

2018/08/15 全球购物

英语硕士生求职简历的自我评价

2013/10/15 职场文书

管事部库房保管员岗位职责

2014/02/21 职场文书

《油菜花开了》教学反思

2014/02/22 职场文书

教师批评与自我批评

2014/10/15 职场文书

安全教育片观后感

2015/06/17 职场文书

Python基础之变量的相关知识总结

2021/06/23 Python

5个pandas调用函数的方法让数据处理更加灵活自如

2022/04/24 Python