$(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. poj 2425 A Chess Game(SG函数)

    A Chess Game Time Limit: 3000MS   Memory Limit: 65536K Total Submissions: 3551   Accepted: 1440 Desc ...

  2. iOS设备保持横排方向

    //保持横排方向 -(NSUInteger)supportedInterfaceOrientations{     returnUIInterfaceOrientationMaskLandscapeL ...

  3. github 上的pull request总结

    自己先要fork别人的代码. 然后把代码git clone到本地.. 当自己有提交的时候, 可以在git commit之后 git push origin master 然后这份git push or ...

  4. 前端开发者应当了解的 Web 缓存知识

    缓存优点 通常所说的Web缓存指的是可以自动保存常见http请求副本的http设备.对于前端开发者来说,浏览器充当了重要角色.除此外常见的还有各种各样的代理服务器也可以做缓存.当Web请求到达缓存时, ...

  5. ng-select ng-options ng-repeat的用法与区别

    最近在用angularJS里的ng-select,ng-options,ng-repeat,发现有两点不太方便: 1.当数据复杂时,循环起来比较麻烦 2.首选项如果不设置,就会为空 整理一下它们的用法 ...

  6. 用Python实现常见排序算法

    最简单的排序有三种:插入排序,选择排序和冒泡排序.这三种排序比较简单,它们的平均时间复杂度均为O(n^2),在这里对原理就不加赘述了.贴出来源代码. 插入排序: def insertion_sort( ...

  7. 【Android - 框架】之OkHttp的使用

    OkHttp是一个非常优秀的网络访问框架,当下非常火的Retrofit的底层就是使用OkHttp进行封装的.接下来介绍以下OkHttp的简单使用. 1.导入依赖 在Android Studio中,在M ...

  8. LINQ多条件OR模糊查询

    本文章转载:http://www.cnblogs.com/guyun/archive/2012/10/18/2729888.html 需求是这样的,有一张表tbl(Key[int],Value[str ...

  9. winform渐变窗口显示/关闭

    //渐渐的消失 for (int iNum = 10; iNum >= 0; iNum --) { //变更窗体的不透明度 this.Opacity = 0.1 * iNum; //暂停 Sys ...

  10. POCISO-採购创建内部订单(R12.2.3)

     採购创建内部订单(R12.2.3) --US Program:Create Internal Orders Short Name:POCISO Application:Purchasing Ex ...