$(document).mouseup(function(e){
var _con = $(' 目标区域 '); // 设置目标区域
if(!_con.is(e.target) && _con.has(e.target).length === ){ // Mark 1
some code... // 功能代码
}
});
/* Mark 1 的原理:
判断点击事件发生在区域外的条件是:
1. 点击事件的对象不是目标区域本身
2. 事件对象同时也不是目标区域的子元素
*/
$el_box = $('.box');//弹出层
$el_box.click(function(e){
e.stopPropagation();//阻止弹出层的click事件,防止冒泡到body
}); $(document).one('click',function(e){//我的弹出层元素是动态载入的,使用过后就销毁了,所以用了one,可以使用bind
$el_box.remove();
});

关于点击空白关闭弹窗的js写法推荐?的更多相关文章

  1. 关于点击空白关闭弹窗的js写法推荐

    $(document).mouseup(function(e){ var _con = $(' 目标区域 '); // 设置目标区域 if(!_con.is(e.target) && ...

  2. jqeury点击空白关闭弹窗

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. 使用js冒泡实现点击空白处关闭弹窗

    什么是事件冒泡? 如图:在一个对象上触发某类事件(比如单击onclick事件),这个事件会向这个对象的父级对象传播,从里到外,直至它被处理(父级对象所有同类事件都将被激活),或者它到达了对象层次的最顶 ...

  4. Flex里监听mouseDownOutside事件解决弹出窗口点击空白关闭功能

    其实当用户在使用 PopUpManager 打开的某个组件外部单击时,会从该组件分派一个mouseDownOutside事件 监听该事件就能实现点击空白处关闭窗口的功能 this.addEventLi ...

  5. vue 点击按钮弹窗,点击关闭按钮关闭弹窗。

    <div @click="btnfc()">点击弹窗按钮</div> <div v-show="show"> <div ...

  6. 【vue】vue +element 搭建项目,点击空白处关闭弹窗

    <template> <div class="step2"> <el-button @click="togglePanel($event)& ...

  7. Bootstrap 模态框 禁止点击空白关闭模态框事件

    在模态框的div中加上 aria-hidden="true" data-backdrop="static" <div class="modal ...

  8. 实例:vue中点击空白区域关闭某个div图层

    <template> <div class="search" ref="searchMain"> <el-input v-mode ...

  9. 关于ElementUI中MessageBox弹框的取消键盘触发事件(enter,esc)关闭弹窗(执行事件)的解决方法

    好久没见了 在项目中遇到一个小小的需求,总结了一下! 详细我就不介绍了,相信大家用过的话,很了解.详见文档-----------> http://element-cn.eleme.io/#/zh ...

随机推荐

  1. 常用google产品

      常用google产品 01.谷歌阅读器(Google Reader):网页版RSS阅读器,方便订阅,组织和分享新闻.有手机版. 02.谷歌相册服务(Google Picasa):提供照片的下载和编 ...

  2. 高性能I/O设计模式Reactor和Proactor

    系统I/O 可分为阻塞型, 非阻塞同步型,非阻塞异步型. (Linux对aio支持的不完整,所以linux上用Reactor比较多:Proactor需要系统API支持真正的“异步”) 阻塞型I/O意味 ...

  3. 阿里巴巴开源项目:分布式数据库同步系统otter(解决中美异地机房) - agapple - ITeye技术网站

    阿里巴巴开源项目:分布式数据库同步系统otter(解决中美异地机房) - agapple - ITeye技术网站 阿里巴巴开源项目:分布式数据库同步系统otter(解决中美异地机房)

  4. 【转】Gabor 入门

    Computer Vision Tutorials Search Primary Menu Skip to content Tutorials Search for:   Gabor Filters ...

  5. 987654321 problem - SGU 107(找规律)

    题目大意:求n位数的平方的后几位结果是987654321的个数是多少. 分析:刚看到这道题的时候怀疑过有没有这样的数,于是暴力跑了一下,发现还真有,9位的数有8个,如下: i=111111111, i ...

  6. 在world2013中插入GB_2312

    文字添加方法: 1.下载字体并解压 2.开始中打开控制面板 3.在控制面板中打开字体文件夹 4.把下载的字体复制到此文件下 5.文字添加完成.

  7. C# 之 System.Object

    System.Object     C#中全部的类都直接或间接继承自System.Object类,这使得C#中的类得以单根继承.假设我们没有明白指定继承类,编译器缺省觉得该类继承自System.Obj ...

  8. iOS-UITouch,UIEvent使用介绍

    UITouch 当用户用一根手指触摸屏幕时,会创建一个与手指相关联的UITouch对象 一根手指对应一个UITouch对象 UITouch的作用 保存着跟手指相关的信息,比如触摸的位置.时间.阶段 当 ...

  9. windows和linux双系统删除linux

    装了Windows和linux双系统的朋友,在后期要删除linux是个比较头痛的问题,因为MBR已经被linux接管,本文的目的是如何在windows 和linux双系统下,简单,完美地卸载linux ...

  10. Thread Runnable 多线程

    1. 实现多线程的两种方法         a) 让这个类继承java.lang.Thread,然后重写run方法         b) 让这个类实现 java.lang.Runnable接口,实现r ...