$(document).mouseup(function(e){
var _con = $(' 目标区域 '); // 设置目标区域
if(!_con.is(e.target) && _con.has(e.target).length === 0){ // Mark 1
some code... // 功能代码
}
});
/* Mark 1 的原理:
判断点击事件发生在区域外的条件是:
1. 点击事件的对象不是目标区域本身
2. 事件对象同时也不是目标区域的子元素
*/

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

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

    $(document).mouseup(function(e){ var _con = $(' 目标区域 '); // 设置目标区域 ){ // Mark 1 some code... // 功能代码 ...

  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. 如何手动让HttpRequestBase.IsAuthenticated 和 HttpContext.User.Identity.IsAuthenticated 为true.

    今天为了重写权限验证这块需要重写AuthorizeAttribute 这个属性,看了官方文档:HttpContextBase.User.Identity.IsAuthenticated 这个必须是tr ...

  2. 【循序渐进学Python】7.面向对象的核心——类型(上)

    我们知道Python是一门面向对象的脚本语言.从C#的角度来看:首先Python支持多继承.Python 类型成员通常都是public的,并且所有成员函数都是virtual的(可以直接重写). 1. ...

  3. linux下基本命令总结

    基本linux命令的使用方法及实例,总结一些常用的命令:  一.创建文件和目录命令:mkdir touch(vim用得较多) 1)mdkir创建一个目录,创建多目录格式 mkdir –p a/{a,b ...

  4. 获取用户的真实ip

    常见的坑有两个: 一.获取的是内网的ip地址.在nginx作为反向代理层的架构中,转发请求到php,java等应用容器上.结果php获取的是nginx代理服务器的ip,表现为一个内网的地址.php获取 ...

  5. H5调用Android拨打电话

    1.AndroidAndJSInterface.java class AndroidAndJSInterface { /** * 该方法将被js调用,用于加载数据 */ @JavascriptInte ...

  6. 如何实现两个Activity 之间如何通讯

    <转> 今天主要学习了Activity 组件,在这里作一下总结 1,学习如何创建Activity 创建 Activity 要点: (1) 一个Activity就是一个类,并且这个类要继承A ...

  7. Angular 核心概念

    module(模块) 作用 通过模块对页面进行业务上的划分,根据不同的功能划分不同的模块. 将重复使用的指令或者过滤器之类的代码做成模块,方便复用 注意必须指定第二个参数,否则变成找到已经定义的模块 ...

  8. 为什么要用visibility:hidden;代替display:none;?

    为什么要用用visibility:hidden;代替display:none;?因为后者更加消耗浏览器: css绘制画面有两种形式:repaint 和reflow,当我们更改css属相如backgro ...

  9. CSS3随内容自动伸缩的背景

    CSS3给我们带来一个非常实用的新属性:border-image,利用这个属性我们可以做出随着内容的增减自动伸缩的背景.废话不多说,看代码! HTML: <ol> <li>第一 ...

  10. 2015年第2本(英文第1本):《The Practice of Programming》

    2015年计划透析10本英文原著,最开始选定的第一本英文书是<Who Moved my Cheese>,可是这本书实在是太短.太简单了,总体的意思就是要顺应变化,要跳出自己的舒适区,全文不 ...