方法:

步骤1:给页面最外出的元素div加点击事件:@click=“popShow = false”。

步骤2:给点击目标元素加点击事件:@click=“popShow = true”。

备注:popShow 为控制弹窗显示与隐藏的标志。

vue实现点击目标元素外页面的其他地方隐藏弹窗。的更多相关文章

  1. js或jquery实现点击某个按钮或元素显示div,点击页面其他任何地方隐藏div

    点击某个元素显示div,点击页面其他任何地方隐藏div,可用javascript和jquery两种方法实现: 一:javascript实现方法技巧<script>//定义stopPropa ...

  2. Vue在点击内部元素时(获得焦点),怎样让外部div元素样式变化?

    问题: div内部有很多元素,div. p. span .input等,各元素有嵌套,现在点击某元素时需要最外面这个div边框高亮,例如,点击了input开始输入 假设html 结构如下  <d ...

  3. vue移动端点击一个元素缩小,松手的时候元素恢复正常

    active伪类解决 HTML代码 <div class='box'> </div> CSS代码 .box { width: 100px; height: 100px; bac ...

  4. jq 点击按钮显示div,点击页面其他任何地方隐藏div

    css .bl_rencai_32{ float: left; height: 35px; line-height: 35px; } .bl_rencai_32 >input{ width: 3 ...

  5. vue点击除了某组件本身的其它地方, 隐藏该组件的方法

    点击emoji表情标签, 出现标签组件,点击其它地方, 改组件消失的效果; <template> <div class="writeZoon"> <d ...

  6. contains 之 点击元素外位置隐藏元素

    contains 之 点击元素外位置隐藏元素 api: contains   检测一个元素包含在另一个元素之内  详解:http://www.runoob.com/jquery/misc-contai ...

  7. 【JS】点击目标外事件与IFRAM自适应高度

    一.点击目标外事件 $(document).mouseup(function(e){ var _con = $('.dropdown-multiSelect-list'); // 设置目标区域 if( ...

  8. vue 点击当前元素添加class 去掉兄弟的class 获取当前点击元素的文字

    点击当前标签给其添加class,兄弟标签class删除 然后获取当前点击元素的文字 演示地址: https://xibushijie.github.io/static/addClass.html &l ...

  9. 在vue中的点击事件怎么获取当前点击的元素

    首先 vue的点击事件 是用 @click = “clickfun()” 属性 在html中绑定的,在点击的函数中 添加$event 参数就可以比如<button @click = “click ...

随机推荐

  1. 跟着Nisy一起学习C语言

    编辑器是使用环境turboc的IDE,使用dos窗口中的edit作为编辑器,有点类似于vim:使用的是xp-sp3的虚拟机上的系统. Nisy说要有两种语言,脚本语言以及一个底层语言,比如现在我的py ...

  2. [转]RDL(C) Report Design Step by Step 3: Mail Label

    本文转自:http://www.cnblogs.com/waxdoll/archive/2006/09/02/493350.html Crystal Report在报表向导中提供了三种向导类型给用户进 ...

  3. unity GUI Layout 组件(全)

    [expand 扩张][fitter 装配工] [envelope 信封,包装] Layout 布局 三种.   Horizontal Layout Group 水平布局 Padding:内边距,单位 ...

  4. 01.CLR的执行模型

    在非托管的C/C++中,可以进行一些底层的操作     "公共语言运行时"(CLR)是一个可由多种编程语言使用的"运行时"          CLR的核心功能包 ...

  5. 如鹏网学习笔记(十一)JQuery

    一.jQuery简介 jQuery是一个JavaScript库,特性丰富,包含若干对象和很多函数,可以替代传统DOM编程的操作方式和操作风格 jQuery通过对DOM API.DOM事件的封装,提供了 ...

  6. java类加载机制及方法调用

    类加载机制 概述 类从被加载到虚拟机内存中开始,到卸载出内存为止,它的整个生命周期包括:加载(Loading).验证(Verification).准备(Preparation).解析(Resoluti ...

  7. 实习小结(三)--- 权限管理(RBAC)

    这一周,大多数时间 用来做需求分析,细化每个页面需要实现的功能.由于这个项目需要四种身份登录查看,分别是学生,老师,领导,管理员.每个身份登入系统显示得页面都不相同,四个角色分析完成后,统计了一下页面 ...

  8. C#学习笔记-外观模式

    题目:股民买卖股票 实现: static void Main(string[] args) { Stock1 gu1 = new Stock1(); Stock2 gu2 = new Stock2() ...

  9. 洛谷P4781 【模板】拉格朗日插值(拉格朗日插值)

    题意 题目链接 Sol 记得NJU有个特别强的ACM队叫拉格朗,总感觉少了什么.. 不说了直接扔公式 \[f(x) = \sum_{i = 1}^n y_i \prod_{j \not = i} \f ...

  10. Drupal网站报错:PDOException: in lock_may_be_available()

    Drupal网站报错: 原因: windows中mysql的服务停止了: 解决办法: 在服务中,启动mysql服务 启动后,刷新页面,问题完美解决