基于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"); 
} 
}); 
});
Javascript 相关文章推荐
使Ext的Template可以解析二层的json数据的方法
Dec 22 Javascript
JS实现随机数生成算法示例代码
Aug 08 Javascript
jQuery的Ajax用户认证和注册技术实例教程(附demo源码)
Dec 08 Javascript
用jquery获取自定义的标签属性的值简单实例
Sep 17 Javascript
详解vue过滤器在v2.0版本用法
Jun 01 Javascript
Vue学习笔记进阶篇之函数化组件解析
Jul 21 Javascript
微信小程序支付前端源码
Aug 29 Javascript
微信小程序自定义tabBar组件开发详解
Sep 24 Javascript
微信小程序外卖选购页实现切换分类与数量加减功能案例
Jan 15 Javascript
详解webpack打包vue项目之后生成的dist文件该怎么启动运行
Sep 06 Javascript
利用JS代码自动删除稿件的普通弹幕功能
Sep 20 Javascript
Node.js API详解之 timer模块用法实例分析
May 07 Javascript
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
解决ThinkPHP关闭调试模式时报错的问题汇总
2015/04/22 PHP
linux下php上传文件注意事项
2016/06/11 PHP
phpmyadmin下载、安装、配置教程
2017/05/16 PHP
Apache+PHP+MySQL搭建PHP开发环境图文教程
2020/08/06 PHP
通过JAVASCRIPT读取ASP设定的COOKIE
2006/11/24 Javascript
Code:findPosX 和 findPosY
2006/12/20 Javascript
javascript preload&amp;lazy load
2010/05/13 Javascript
原生Js页面滚动延迟加载图片实现原理及过程
2013/06/24 Javascript
仿谷歌主页js动画效果实现代码
2013/07/14 Javascript
JavaScript的setAttribute兼容性问题解决方法
2013/11/11 Javascript
JQuery 图片滚动轮播示例代码
2014/03/24 Javascript
javascript实现playfair和hill密码算法
2014/12/07 Javascript
Javascript writable特性介绍
2015/02/27 Javascript
php常见的页面跳转方法汇总
2015/04/15 Javascript
jQuery热气球动画半透明背景的后台登录界面代码分享
2015/08/28 Javascript
AngularJS实现全选反选功能
2015/12/08 Javascript
JS中对象与字符串的互相转换详解
2016/05/20 Javascript
如何用JavaScript实现动态修改CSS样式表
2016/05/20 Javascript
Angular 理解module和injector,即依赖注入
2016/09/07 Javascript
原生javascript移动端滑动banner效果
2017/03/10 Javascript
bootstrap table表格客户端分页实例
2017/08/07 Javascript
javascript按顺序加载运行js方法
2017/12/01 Javascript
解决Vue打包后访问图片/图标不显示的问题
2019/07/25 Javascript
微信小程序实现轨迹回放的示例代码
2019/12/13 Javascript
js实现简易ATM功能
2020/10/27 Javascript
原生JS实现拖拽效果
2020/12/04 Javascript
cProfile Python性能分析工具使用详解
2019/07/22 Python
python机器学习实现决策树
2019/11/11 Python
Python : turtle色彩控制实例详解
2020/01/19 Python
Python换行与不换行的输出实例
2020/02/19 Python
如何用canvas实现在线签名的示例代码
2018/07/10 HTML / CSS
在职研究生自我鉴定
2013/10/16 职场文书
仓库保管员岗位职责
2015/02/09 职场文书
Win11局域网共享权限在哪里设置? Win11高级共享的设置技巧
2022/04/05 数码科技
Python之matplotlib绘制折线图
2022/04/13 Python
SQL Server #{}可以防止SQL注入
2022/05/11 SQL Server