【 js 片段 】点击空白或者页面其他地方,关闭弹框
$(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. 事件对象同时也不是目标区域的子元素
*/
原文地址:https://segmentfault.com/q/1010000000452465
【 js 片段 】点击空白或者页面其他地方,关闭弹框的更多相关文章
- js+css jQuery实现页面后退执行 & 遮罩弹框
JS部分 <script src="http://libs.baidu.com/jquery/2.0.0/jquery.js"></script> < ...
- jq点击按钮打开和关闭弹出层,点击除了当前按钮以外的地方关闭弹出层
1.html <a id="more" onclick="moreFun()">更多</a> <ul id="moreL ...
- 利用layer实现MVC页面数据互交提示弹框
需求说明: 一个表单页面,点击提交之后,进入后台进行一系列数据交互,然后将交互信息返回至页面中,并以弹框形式展示 应用场景: 添加.修改.删除数据后,返回数据操作是否成功,以及一些其他信息 前期准备: ...
- vue中超简单的方法实现点击一个按钮出现弹框,点击弹框外关闭弹框
效果图展示: View层 <template> <div> <div class="mask" v-if="showModal" ...
- jquery点击弹框外层关闭弹框
$(document).bind("click",function(e){ if($( e.target ).closest(".game-cont ...
- jQuery点击自身以外地方关闭弹出层
转载自:http://blog.163.com/abkiss@126/blog/static/325941002012111754349590/ 主要功能是点击显示,然后通过点击页面的任意位置都能关闭 ...
- jQuery弹出层_点击自身以外地方关闭弹出层
<html> <style> .hide{display:none;} </style> <script type="text/javascript ...
- vue 点击弹窗外框关闭弹框
https://blog.csdn.net/zjw0742/article/details/77822777 ready() { document.addEventListener('click', ...
- HTML页面的三种弹框方式
1.弹出警告框,带确定按钮:alert 2.弹出,选择框 有确认和取消按钮 confirm 3. 弹出,输入框 : prompt
随机推荐
- POST 400 (BAD REQUEST)
遇到这种错,1,F12打开控制台,2,点击network,找到发送的请求. 3,点击请求,4,看右侧的 Header Preview Response 应该能找到原因. 就拿刚才来说,找了好几个小时原 ...
- Slope one—个性化推荐中最简洁的协同过滤算法
Slope One 是一系列应用于 协同过滤的算法的统称.由 Daniel Lemire和Anna Maclachlan于2005年发表的论文中提出. [1]有争议的是,该算法堪称基于项目评价的non ...
- SAX,功能强大的 API
https://www.ibm.com/developerworks/cn/xml/x-saxapi/ SAX,功能强大的 API 在摘自 XML by Example 的本篇预览中比较了 DOM 和 ...
- 【JS深入学习】—— 一句话解释闭包
闭包的定义: 闭包(closuer)是一个受到保护的变量空间,由内嵌函数构成.就是说闭包内的变量不能被外部函数访问,为什么会这样? 函数的作用域: JS具有函数级的作用域,这表明外部函数不能访问内部函 ...
- [SqlServer] Error: 15023
Use DataBaseName go sp_change_users_login 'update_one', 'UserName', 'UserName' 恢复数据库后,添加用户,报错号15023 ...
- 移动端 实现ul横向滚动条
ul { display: flex; width: 100%; height: 3.333333rem; background: #fff; padding: 0.373333rem 0.32rem ...
- docker微服务部署之:六、Rancher管理部署微服务
docker微服务部署之:五.利用DockerMaven插件自动构建镜像 一. 什么是Rancher Rancher是一个开源的企业级容器管理平台.通过Rancher,企业再也不必自己使用一系列的开源 ...
- 我与GitHub的第一次——自制音乐文件修改器
背景: 随机播放,所有的音乐播放器里面现在几乎都有这个功能吧.但是有没有发现,自己的播放器在选择随机播放的时候,经常会听到重复顺序的歌曲呢?反正我是有这样的感觉,无耐自己平时下的歌曲都是“歌手名—歌曲 ...
- NoSQL数据库--简介
一.What's NoSQL? NoSQL,全称是”Not Only Sql”,指的是非关系型的数据库.这类数据库主要有这些特点:非关系型的.分布式的.开源的.水平可扩展的.原始的目的是为了大规模we ...
- jqGrid随窗口大小变化自适应大小-转
第一种: jqGrid随窗口大小变化自适应宽度 $(function(){ $(window).resize(function(){ $("#listId").setGridWid ...