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>

SEE ALSO

点击区域外隐藏该区域，event.stopPropagation()的更多相关文章

  1. js实现的点击div区域外隐藏div区域(转)

    首先看下JS的事件模型,JS事件模型为向上冒泡,如onclick事件在某一DOM元素被触发后,事件将跟随节点向上传播,直到有click事件绑定在某一父节点上,如果没有将直至文档的根. 阻止冒泡: 1. ...

  2. js实现的点击div区域外隐藏div区域

    首先看下JS的事件模型,JS事件模型为向上冒泡,如onclick事件在某一DOM元素被触发后,事件将跟随节点向上传播,直到有click事件绑定在某一父节点上,如果没有将直至文档的根. 阻止冒泡:1.对 ...

  3. jQuery实现鼠标点击Div区域外隐藏Div

    冒泡定义:当一个元素上的事件被触发的时候,比如说鼠标点击了一个按钮,同样的事件将会在那个元素的所有祖先元素中被触发.这一过程被称为事件冒泡:这个事件从原始元素开始一直冒泡到DOM树的最上层.(摘自网络 ...

  4. js实现点击div以外区域，隐藏div区域

    <body style="text-align:center;"> <input type="text" style="width: ...

  5. jquery实现点击div外隐藏div

    html <div style="width:100px;height:100px;border:1px solid #ff0" id="div"> ...

  6. jquery阻止冒泡事件：$('span').bind("click",function(event){event.stopPropagation();})（有用源）

    冒泡事件就是点击子节点,会向上触发父节点,祖先节点的点击事件. <body> <div id="content"> 外层div元素 <span> ...

  7. 关于js中return false、event.preventDefault()和event.stopPropagation()

    在平时项目中,如果遇到需要阻止浏览器默认行为,大家经常会用return false;和event.preventDefault()来阻止,但对它俩的区别还是有些一知半解,于是看了文档,查了些资料,在此 ...

  8. 【转】Android点击空白区域，隐藏输入法软键盘

    原文网址:http://www.2cto.com/kf/201505/401382.html 很多时候,我们在使用应用时,会出现输入法软键盘弹出的问题,通常情况下,我们默认会使用户点击返回键或者下一步 ...

  9. js实现点击按钮时显示弹框，点击按钮及弹框以外的区域时隐藏弹框

    转自https://blog.csdn.net/yimawujiang/article/details/86496936 问题:js实现点击按钮时显示弹框,点击按钮及弹框以外的区域时隐藏弹框? 方案一 ...

随机推荐

  1. springboot+redis

    上篇整合了DB层,现在开始整合缓存层,使用redis. springboot驱动注解,使用spring注入JedisPool便可封装自己的redis工具类. package hello.configu ...

  2. IntelliJ IDEA使用小技巧

    1:设置类,接口,枚举注解模板 #if (${PACKAGE_NAME} && ${PACKAGE_NAME} != "")package ${PACKAGE_NA ...

  3. GridView 实现LinkButton下载文件/附件

    <asp:TemplateField > <ItemTemplate> <asp:LinkButton ID="lbtnDownFile" runat ...

  4. iphone状态栏高度？

      设备分辨率         状态栏高度           导航栏高度 标签栏高度 iPhone6 plus       1242×2208 px           60px           ...

  5. Python开发【第十章】：I/O多路复用、异步I/O(综合篇)

    近期心得:国庆节放假再加上近期工作太忙,已经有半个月没更新博客了,程序更别说了,也没怎么去写,自己给自己着实放了个大假.谈谈感受的话,没有python的日子,每天看书.看电影.各种玩,还有爸妈伺候着, ...

  6. Android pop3与imap方式接收邮件（javamail）

    需要下载3个jar包:mail.jar/    activation.jar/    additionnal.jar 1.pop3 /** * 以pop3方式读取邮件,此方法不能读取邮件是否为已读,已 ...

  7. Android 解析Json_fastJson

    FastJSON是一个很好的java开源json工具类库,相比其他同类的json类库,它的速度的确是fast,最快!但是文档做得不好,在应用前不得不亲测一些功能.   实际上其他的json处理工具都和 ...

  8. 如何设置jvm内存

    本文向大家简单介绍一下进行JVM内存设置几种方法,安装Java开发软件时,默认安装包含两个文件夹,一个JDK(Java开发工具箱),一个JRE(Java运行环境,内含JVM),其中JDK内另含一个JR ...

  9. Java 实现函数回调

    在Java里没用委托(delegate)这方法,所以想要实现回调还是有些麻烦.(想了解C#如何实现?请查看:http://www.cnblogs.com/Martin_Q/p/4478494.html ...

  10. Windows Server 2008 R2 主域控制器委派DNS到子域控控制器

    一.实验网络拓扑图: 二.实现目的: 子域控制器的域用户能查询到主域控制器的DNS服务器的A记录,主域控制器的域用户也能查询到子域控制器的DNS服务器的A记录. 标注:此章节不讲解域控和DNS服务器的 ...