直接上代码:

mounted: function () {
let that = this;
$(document).on('click', function (e) {
let dom = $('.myDiv')[0]; // 自定义div的class if (dom) {
// 如果点击的区域不在自定义dom范围
if (!dom.contains((e.target))) {
that.showMyDiv = false;
}
}
});
},
beforeDestroy() {
$(document).off('click');
}

vue中点击屏幕其他区域关闭自定义div弹出框的更多相关文章

  1. [ vue ] Quasar封装q-dialog组件,在外层实现弹出框的开启和关闭

    场景描述: 见:https://www.cnblogs.com/remly/p/12981582.html 具体实现: <!-- 父组件 --> <template> < ...

  2. UIPresentationController - iOS自定义模态弹出框

    参考: https://developer.apple.com/library/archive/featuredarticles/ViewControllerPGforiPhoneOS/Definin ...

  3. 自定义PopupWindow弹出框(带有动画)

    使用PopupWindow来实现弹出框,并且带有动画效果 首先自定义PopupWindow public class LostPopupWindow extends PopupWindow { pub ...

  4. vue.js 利用组件之间通讯,写一个弹出框例子

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. iOS自定义提示弹出框(类似UIAlertView)

    菜鸟一枚,大神勿喷.自己在牛刀小试的时候,发现系统的UIAlertView有点不喜欢,然后就自己自定义了一个UIAlertView,基本上实现了系统的UIAlertView,可以根据项目的需求修改UI ...

  6. elementUI vue tree input 懒加载 输入下拉树型示例 点击其他区域关闭自定义div

    <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8&quo ...

  7. swing自定义JDialog弹出框

    第一次搞swing,自定义JDialog的例子较少,写下来备忘 ,对JDialog中的文本框进行了验证 package com.chauvet; import java.awt.Component; ...

  8. 自定义ionic弹出框

    <img width="64" height="64" src="img/timg.jpg" style="border-r ...

  9. 微信小程序之自定义底部弹出框动画

    最近做小程序时,会经常用到各种弹框.直接做显示和隐藏虽然也能达到效果,但是体验性太差,也比较简单粗暴.想要美美地玩,添加点动画还是非常有必要的.下面做一个底部上滑的弹框. wxml <view ...

随机推荐

  1. Java流程控制之(二)循环

    目录 while循环 do..while循环 for循环 while循环和for循环基本概念--直接上代码! while循环 int i = 0; while(i<10) { System.ou ...

  2. 【Luogu P3376】网络最大流

    Luogu P3376 最大流是网络流模型的一个基础问题. 网络流模型就是一种特殊的有向图. 概念: 源点:提供流的节点(入度为0),类比成为一个无限放水的水厂 汇点:接受流的节点(出度为0),类比成 ...

  3. day 36 初始前端 html语言

    参考博客https://www.cnblogs.com/majj/p/9056951.html进行学习 html标签 特征: .空白折叠现象 .对空格和换行不敏感 .标签要严格封闭 p标签的嵌套 多注 ...

  4. vi指令详解

    ★ vi的模式(命令模式.插入模式.ex模式) 1)命令模式: 在我们刚刚通过vi新建或打开一个已经存在的文件时,首先默认被读取的模式就是“命令模式”,命令模式的特征就是,在编辑器窗口左下角的位置上没 ...

  5. CTF中遇到的php

    1.if(eregi("hackerDJ",$_GET[id])) {   //eregi字符串对比 echo("<p>not allowed!</p& ...

  6. 依赖注入利器 - Dagger ‡

    转载请标明出处:http://blog.csdn.net/shensky711/article/details/53715960 本文出自: [HansChen的博客] 概述 声明需要注入的对象 如何 ...

  7. 【Flask系列】开发一个简单的Flask程序

    知识点 初始化:每一个flask程序都必须创建一个程序实例,遵循WSGI(Web Server Gateway interface)协议,把请求->flask Obj; 创建实例: app = ...

  8. python_thread

    多任务编程:可以有效的利用计算机资源,同时执行多个任务进程:进程就是程序在计算机中一次执行的过程进程 和 程序的区别:    1.程序是一个静态文件的描述,不占计算机的系统资源    2.进程是一个动 ...

  9. Block-wise 2D kernel PCA/LDA for face recognition-笔记

    In the present work, we propose a framework for kernel-based 2D feature extraction algorithms tailor ...

  10. __getattribute__(self, obj) 这个方法中的obj这个参数

    class Itcast(object): def __init__(self, subject1): self.subject1 = subject1 print("^^^^^^^---- ...