温故而知新 js 点击空白处关闭气泡
诀窍1:使用el.contains(e) 来判断点击的区域
诀窍2:使用mouseup
诀窍3:完成之后,移除事件
showpopover (e) {
this.popover = !this.popover
var closePopover = (event) => {
if (!this.$refs.popover.contains(event.target)) {
this.popover = false
document.body.removeEventListener('mouseup', closePopover)
}
}
document.body.addEventListener('mouseup',closePopover)
}


温故而知新 js 点击空白处关闭气泡的更多相关文章
- 使用js冒泡实现点击空白处关闭弹窗
什么是事件冒泡? 如图:在一个对象上触发某类事件(比如单击onclick事件),这个事件会向这个对象的父级对象传播,从里到外,直至它被处理(父级对象所有同类事件都将被激活),或者它到达了对象层次的最顶 ...
- js点击空白处触发事件
我们经常会出现点击空白处关闭弹出框或触发事件 <div class="aa" style="width: 200px;height: 200px;backgroun ...
- js点击空白处弹窗消失
$(document).mousedown(function(e){ var _list = $('#pop'); if(!_list.is(e.target) && _list.ha ...
- 【vue】vue +element 搭建项目,点击空白处关闭弹窗
<template> <div class="step2"> <el-button @click="togglePanel($event)& ...
- js点击时关闭该范围下拉菜单之外的菜单
$(function(){ $(document).bind("click",function(e){ //id为menu的是菜单 if($(e.target).closest(& ...
- bootstrap禁用点击空白处关闭模态框
原博主地址:http://www.cnblogs.com/godlovelian/p/4530342.html
- Flex里监听mouseDownOutside事件解决弹出窗口点击空白关闭功能
其实当用户在使用 PopUpManager 打开的某个组件外部单击时,会从该组件分派一个mouseDownOutside事件 监听该事件就能实现点击空白处关闭窗口的功能 this.addEventLi ...
- 阻止Bootstrap 模态框(Modal)点击空白处时关闭
默认情况下点击空白处时会关闭模态框,添加data-backdrop="static"后可以阻止关闭
- BootstrapDialog点击空白处禁止关闭
在乐学一百的项目当中引用到了BootstrapDialog,其中后台发送短信时,为了防止管理员编辑了半天的短息,突然间因为点击某个空白区域导致丢失,所以在此禁用掉点击空白关闭弹出框. 主要属性为: c ...
随机推荐
- SQL Server 的事务和锁 图解
http://www.cnblogs.com/lxconan/archive/2011/10/20/2218396.html
- 设置启用mysql慢查询日志
--设置log文件位置 set global slow_query_log_file = /sql_log/slow_log.log; --设置是否启用记录没有使用索引的sql set global ...
- 【QQ输入法】QQ输入法输入的英文字母顺便空格很大
正常的输入出来是这个样子的: 现在变成了这个样子: 怎么解决这个问题呢: 快捷键 shift+空格 即可解决
- Nginx集群
转自:http://hi.baidu.com/xingyuanju/blog/item/779a2a23b7ebb749935807f1.html http://hi.baidu.com/dianhu ...
- poj 1330 Nearest Common Ancestors 题解
Nearest Common Ancestors Time Limit: 1000MS Memory Limit: 10000K Total Submissions: 24618 Accept ...
- 最新office2003密钥
Microsoft Office Professional Edition 2003GWH28-DGCMP-P6RC4-6J4MT-3HFDY Office2003序列号注册码sn: WFDWY-XQ ...
- PHP的错误处理方式(开发和上线)
对于PHP开发人员来说,一旦某个产品投入使用.应该马上将 display_errors选项关闭.以免由于这些错误所透露的路径.数据库连接.数据表等信息而遭到黑客攻击. 可是.不论什么一个产品在投入使用 ...
- 设计模式(一)简单工厂(创建型)(Java&&PHP)
面向对象设计的基本原则 单一职责系统中的每一个对象应该只有一个单独的职责,所有对象关注的应该是自身职责的完成. 基本思想:高内聚,低耦合. 开闭原则一个对象对扩展开放,对修改关闭.基本思想:对类的改动 ...
- beyond compare 比较Xls文件时只显示有差异的列
beyond compare是专业级的文件比较工具,可以比较所有的文件格式,已经成为我工作中的必备软件 在某一个工作项目中需要比较两个Xls文件,两个文件列是相同的,主要是看两个文件的列内容有什么变化 ...
- Unity3d使用json与javaserver通信
Unity3d使用json能够借助LitJson 下载LitJson,复制到Unity3d工作文件夹下 于是能够在代码中实现了 以下发送请求到server并解析 System.Collections. ...