mounted() {
//点击任意位置关闭区域弹窗
document.addEventListener('click', (e) => { //获取弹窗对象
const userCon = document.getElementsByClassName('tanKuang')[0];
const userCon1 = document.getElementsByClassName('tanKuang')[1]; //判断弹窗对象中是否包含点击对象
if (userCon && !userCon.contains(e.target)&& !userCon1.contains(e.target)) {
//如果包含则跳转回之前的页面
this.isShowModal = false;
} }) },

vue中点击其他任意位置关闭弹框的更多相关文章

  1. vue中点击屏幕其他区域关闭自定义div弹出框

    直接上代码: mounted: function () { let that = this; $(document).on('click', function (e) { let dom = $('. ...

  2. vue中点击空白处隐藏弹框(用指令优雅地实现)

    在写vue的项目的时候,弹框经常性出现,并要求点击弹框外面,关闭弹框,那么如何实现呢?且听我一一...不了,能实现效果就好 <template> <div> <div c ...

  3. 点击任意位置关闭(CocosCreator)

    推荐阅读:  我的CSDN  我的博客园  QQ群:704621321  我的个人博客       今天,接触到一个新功能,当弹出某个弹框时,需要点击除弹框的剩余任意位置,来关闭该弹框,例如:当红框内 ...

  4. Android点击其他任意位置收起软键盘

    在Android应用开发中,经常出现这样的需求,用户在输入文字的过程中,可能不想继续输入了,通过滑动或者点击其他位置(除软键盘和EditText以外的任何位置),希望能够自动收回键盘,这个功能可能有些 ...

  5. vue 手机物理返回键关闭弹框

    1.打开弹窗调用 window.history.pishState() 函数 2.关闭弹框 3.mounted 生命周期 监听popstate 事件 4.beforeDestroy 生命周期 移除po ...

  6. 简单数学算法demo和窗口跳转,关闭,弹框

     简单数学算法demo和窗口跳转,关闭,弹框demo <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN&quo ...

  7. vue中超简单的方法实现点击一个按钮出现弹框,点击弹框外关闭弹框

    效果图展示: View层 <template> <div> <div class="mask" v-if="showModal" ...

  8. jQuery点击自身以外地方关闭弹出层

    转载自:http://blog.163.com/abkiss@126/blog/static/325941002012111754349590/ 主要功能是点击显示,然后通过点击页面的任意位置都能关闭 ...

  9. jq点击按钮打开和关闭弹出层,点击除了当前按钮以外的地方关闭弹出层

    1.html <a id="more" onclick="moreFun()">更多</a> <ul id="moreL ...

  10. 小程序中点击input控件键盘弹出时placeholder文字上移

    最近做的一个小程序项目中,出现了点击input控件键盘弹出时placeholder文字上移,刚开始以为是软键盘弹出布局上移问题是传说中典型的fixed 软键盘顶起问题,因此采纳了网上搜到的" ...

随机推荐

  1. [Unity移动端]Mono与IL2Cpp

    参考链接: https://blog.csdn.net/linxinfa/article/details/87358809 https://blog.csdn.net/Aison_/article/d ...

  2. 行转列 && 字段拆分

    explode称之为Hive爆炸函数,意思就是将一行数据炸开.Usage:explode(array/map) explode函数传递的参数必须是一个array或者是map hivescala> ...

  3. Hadoop-HA节点介绍

    设计思想 hadoop2.x启用了主备节点切换模式(1主1备) 当主节点出现异常的时候,集群直接将备用节点切换成主节点 要求备用节点马上就要工作 主备节点内存几乎同步 有独立的线程对主备节点进行监控健 ...

  4. PHP 文件和文件夹操作

    文件夹操作 创建文件夹 mkdir(名称,权限,递归创建):创建文件 例如: #创建文件夹 mkdir('./aa') # 创建 aa 文件夹 mkdir('./aa/bb') # 在 aa 目录下创 ...

  5. SpringCloud微服务实战——搭建企业级开发框架(五十一):微服务安全加固—自定义Gateway拦截器实现防止SQL注入/XSS攻击

      SQL注入是常见的系统安全问题之一,用户通过特定方式向系统发送SQL脚本,可直接自定义操作系统数据库,如果系统没有对SQL注入进行拦截,那么用户甚至可以直接对数据库进行增删改查等操作.   XSS ...

  6. ABAP 调用HTTP上传附件(二)之中文乱码

    1.这篇文章的由来 之前已经发表了<ABAP 调用HTTP上传附件>的文章,详细介绍了如何通过HTTP请求传输附件,可点击链接参考原有文档 因为之前对传输文件的中文文件名处理上解释不够详细 ...

  7. 【Unity3D】基于粒子系统实现烟花特效

    1 需求实现 ​ 粒子系统ParticleSystem 中介绍了粒子初始化.粒子发射.发射器形状.渲染器.碰撞.子发射器.拖尾等粒子系统的基本用法,本节将基于粒子系统实现烟花特效. ​ 实现需求如下( ...

  8. 90 条简单实用的 Python 编程技巧,建议收藏

    编码原则 建议 1:理解 Pythonic 概念 -- 详见 Python 中的<Python 之禅> 建议 2:编写 Pythonic 代码 避免不规范代码,比如只用大小写区分变量.使用 ...

  9. Activiti 7 启动流程实例

    首先,考虑下面这样一个流程图 主要的流程定义如下: <process id="demo" name="demo" isExecutable="t ...

  10. 7.远程代码执行漏洞RCE

    远程代码执行漏洞RCE 1.RCE Remote Code Execute 远程代码执行 Remote Command Execute 远程命令执行 2.危害 窃取服务器的敏感数据.文件 对电脑的文件 ...