关于点击空白关闭弹窗的js写法推荐?
$(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写法推荐?的更多相关文章
- 关于点击空白关闭弹窗的js写法推荐
$(document).mouseup(function(e){ var _con = $(' 目标区域 '); // 设置目标区域 if(!_con.is(e.target) && ...
- jqeury点击空白关闭弹窗
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 使用js冒泡实现点击空白处关闭弹窗
什么是事件冒泡? 如图:在一个对象上触发某类事件(比如单击onclick事件),这个事件会向这个对象的父级对象传播,从里到外,直至它被处理(父级对象所有同类事件都将被激活),或者它到达了对象层次的最顶 ...
- Flex里监听mouseDownOutside事件解决弹出窗口点击空白关闭功能
其实当用户在使用 PopUpManager 打开的某个组件外部单击时,会从该组件分派一个mouseDownOutside事件 监听该事件就能实现点击空白处关闭窗口的功能 this.addEventLi ...
- vue 点击按钮弹窗,点击关闭按钮关闭弹窗。
<div @click="btnfc()">点击弹窗按钮</div> <div v-show="show"> <div ...
- 【vue】vue +element 搭建项目,点击空白处关闭弹窗
<template> <div class="step2"> <el-button @click="togglePanel($event)& ...
- Bootstrap 模态框 禁止点击空白关闭模态框事件
在模态框的div中加上 aria-hidden="true" data-backdrop="static" <div class="modal ...
- 实例:vue中点击空白区域关闭某个div图层
<template> <div class="search" ref="searchMain"> <el-input v-mode ...
- 关于ElementUI中MessageBox弹框的取消键盘触发事件(enter,esc)关闭弹窗(执行事件)的解决方法
好久没见了 在项目中遇到一个小小的需求,总结了一下! 详细我就不介绍了,相信大家用过的话,很了解.详见文档-----------> http://element-cn.eleme.io/#/zh ...
随机推荐
- [转载]函数getopt(),及其参数optind
最近用到了getopt()这个函数,对它进行了一些了解.这篇博文还是写的非常清楚的.值得学习.最近在改进一个开源项目,希望自己能静下心好好分析代码. ------------------------- ...
- java多线程编程(2)交替输出数字和字母
mark一下,不停的看看notify和wait的没有理解 class Printer { int index=0; //输出奇数 public synchronized void printA(int ...
- MVC 5 第二章 项目结构
通过本章学习,你将了解到一个MVC 5应用程序的项目组成以及项目文件的相关信息,从而更好地架构设计出自己的项目结构. 单从MVC的字面意思我们便能够注意到M-模型, View-视图, Controll ...
- nyoj 88 汉诺塔(一)【快速幂】
汉诺塔(一) 时间限制:1000 ms | 内存限制:65535 KB 难度:3 描述 在印度,有这么一个古老的传说:在世界中心贝拿勒斯(在印度北部)的圣庙里,一块黄铜板上插着三根宝石针.印度 ...
- Java Bean 获取properties文件的读取
实际的开发过程中,将一些配置属性从java代码中提取到properties文件中是个很好的选择,降低了代码的耦合度.下面介绍两种通过spring读取properties文件的方法,以ip地址配置为例. ...
- ELK Packetbeat 部署指南(15th)
原文链接:http://www.ttlsa.com/elk/elk-packetbeat-deployment-guide/ Packetbeat 是一个实时网络数据包分析工具,与elasticsea ...
- 【Android - 框架】之Retrofit的使用
Retrofit是Square公司发布的一个可以应用在Android和Java中的Http客户端访问框架,其底层应用的是OkHttp. 在这个帖子中,我们以下面这个Http请求为例: https:// ...
- hadoop实例
一篇讲得很好的hadoop实例,非常适合初学者学习hadoop. 本文转载自:http://www.cnblogs.com/xia520pi/archive/2012/06/04/2534533.ht ...
- Eclipse中修改SVN用户名和密码方法
于在svn 的界面中并没有为我们提供直接更换用户名密码的地方,所以一旦我们需要更换用户名的就需要自己想一些办法. 解决方案: 在Eclipse 使用SVN 的过程中大多数人往往习惯把访问SVN 的用户 ...
- 构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统(14)-系统小结
原文:构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统(14)-系统小结 不知不觉已经过了13讲,(本来还要讲多一讲是,数据验证之自定义验证,基于园友还是对权限这 ...