点击区域外隐藏该区域，event.stopPropagation()
- Description: Prevents the event from bubbling up the DOM tree, preventing any parent handlers from being notified of the event.
点击区域外隐藏该区域Example:
<!DOCTYPE html>
<html>
<head>
<meta content="charset=utf-8" />
<style type="text/css">
.box {
width:100px;
height:100px;
background:blue;
}
</style>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
$(document).click(function() {
$('.box').hide();
})
$('.box').click(function(event) {
event.stopPropagation();
})
});
</script>
</head>
<body>
<div class="box">box</div>
</body>
</html>
点击区域外隐藏该区域，event.stopPropagation()的更多相关文章
- js实现的点击div区域外隐藏div区域(转)
首先看下JS的事件模型,JS事件模型为向上冒泡,如onclick事件在某一DOM元素被触发后,事件将跟随节点向上传播,直到有click事件绑定在某一父节点上,如果没有将直至文档的根. 阻止冒泡: 1. ...
- js实现的点击div区域外隐藏div区域
首先看下JS的事件模型,JS事件模型为向上冒泡,如onclick事件在某一DOM元素被触发后,事件将跟随节点向上传播,直到有click事件绑定在某一父节点上,如果没有将直至文档的根. 阻止冒泡:1.对 ...
- jQuery实现鼠标点击Div区域外隐藏Div
冒泡定义:当一个元素上的事件被触发的时候,比如说鼠标点击了一个按钮,同样的事件将会在那个元素的所有祖先元素中被触发.这一过程被称为事件冒泡:这个事件从原始元素开始一直冒泡到DOM树的最上层.(摘自网络 ...
- js实现点击div以外区域，隐藏div区域
<body style="text-align:center;"> <input type="text" style="width: ...
- jquery实现点击div外隐藏div
html <div style="width:100px;height:100px;border:1px solid #ff0" id="div"> ...
- jquery阻止冒泡事件：$('span').bind("click",function(event){event.stopPropagation();})（有用源）
冒泡事件就是点击子节点,会向上触发父节点,祖先节点的点击事件. <body> <div id="content"> 外层div元素 <span> ...
- 关于js中return false、event.preventDefault()和event.stopPropagation()
在平时项目中,如果遇到需要阻止浏览器默认行为,大家经常会用return false;和event.preventDefault()来阻止,但对它俩的区别还是有些一知半解,于是看了文档,查了些资料,在此 ...
- 【转】Android点击空白区域，隐藏输入法软键盘
原文网址:http://www.2cto.com/kf/201505/401382.html 很多时候,我们在使用应用时,会出现输入法软键盘弹出的问题,通常情况下,我们默认会使用户点击返回键或者下一步 ...
- js实现点击按钮时显示弹框，点击按钮及弹框以外的区域时隐藏弹框
转自https://blog.csdn.net/yimawujiang/article/details/86496936 问题:js实现点击按钮时显示弹框,点击按钮及弹框以外的区域时隐藏弹框? 方案一 ...
随机推荐
- final阶段成员贡献分
项目名:连连看 组名:天天向上 组长:王森 组员:张政.张金生.林莉.胡丽娜 final阶段各组员的贡献分分配如下: 姓名 个人工作量 组长评价 个人评价 团队贡献总分 张政 11 7 6 6.00 ...
- OMXplayer播放视频的参数说明
1.OMXplayer支持硬解码,因此是一个非常不错的选择.2.支持格式目前知道的有:MKV.AVI.FLV.MP43.如果想用全屏播放,参数是:-r4.如果想用HDMI输出声音,参数是:-o hdm ...
- CSS方法论完全总结
软件开发领域所有的工程问题,归根结底衍生自一个问题:代码量大了怎么办? 对于CSS而言,因代码量增大导致的核心问题是命名冲突. 解决命名冲突的方法论是模块化,围绕此方法论,演化出种种模块化方案. 一. ...
- Symmetric Multiprocessor Organization
COMPUTER ORGANIZATION AND ARCHITECTURE DESIGNING FOR PERFORMANCE NINTH EDITION
- Linq读取XML
var customerList = ( from e in XDocument.Load("customers.xml"). Root.Elements("custom ...
- 浅谈java抽象类和接口
第一次,写这个,没有把图片放上来,有兴趣的可以点击连接看原文 http://note.youdao.com/noteshare?id=aecbd52b9240f23c0954e8086b848a17 ...
- android必须要进行为不同分辨率设备切图
以分辨率为1920×1080的android设备为例.在项目中加载资源的位置为xxhdpi文件夹: 例如将图片放入mdpi文件夹中就会出现,图片的横纵尺寸分别乘3被的后果,因为它认为在这个文件夹中是低 ...
- Ubuntu 14.04 编译安装 husky
简介 Husky是一个大数据分布式开发框架,用C++开发,因为粗粒度(coarse-grained)平台(如Spark,Hadoop,Flink)MR耗时太大,然后细粒度(fine-grained)平 ...
- ubuntu 更改时区
更改/etc/timezone Asia/Chongqing sudo dpkg-reconfigure tzdata
- 磁盘io的那些事
1.使用hdparm命令 hdparm -Tt /dev/sda /dev/sda: Timing cached reads: 6676 MB in 2.00 seconds = 3340.18 M ...