vue阻止冒泡事件 阻止点击事件的执行 结合div和组件阻止点击事件
vue阻止冒泡事件 阻止点击事件的执行
<div @click="alerA1()" > <div @click.stop="alerA2()><div> </div>
这样就可以实现阻止点击 点击 alerA2() 不会执行 alerA1()
如果 你中间的是一个组件类似这样的
<div @click="alerA1()" > <div @click.stop=""> <el-dropdown trigger="click" ></el-dropdown> //这里是下拉菜单组件trigger="click" <div> </div>
只需要在组件的外面 嵌套个div 然后设置@click.stop="" 即可解决
vue阻止冒泡事件 阻止点击事件的执行 结合div和组件阻止点击事件的更多相关文章
- 页面内部DIV让点击外部DIV 事件不发生(阻止冒泡事件)
如标题的情况,经常发生,尤其是在一些弹出框上面之类的. <script> function zuzhimaopao(){ e.stopPropagation(); } </scrip ...
- js常用阻止冒泡事件
原文链接:http://caibaojian.com/javascript-stoppropagation-preventdefault.html 防止冒泡 w3c的方法是e.stopPropagat ...
- 事件修饰符 阻止冒泡 .stop 阻止默认事件 .prevent
stop修饰符 阻止冒泡行为 可以在函数中利用$event传参通过stopPropagation()阻止冒泡 通过直接在元素中的指令中添加 .stop prevent修饰符 阻止默认行为 可以在函数中 ...
- 重新认识vue之事件阻止冒泡
冒泡的表现 近期用vue做了一个需求,大概是同一个区域,点击不同位置有不同的响应函数,还有个总的响应函数,好吧,如下图所示: 他们的DOM结构如下: <div v-for="(item ...
- 点击其它地方隐藏div/事件冒泡/sweet-alert阻止冒泡
点击document时把div隐藏,但点击div时阻止点击事件冒泡到document,从而实现“点击文档其它地方隐藏div,点击div本身不隐藏”.js代码如下:$("#div") ...
- 点击tr实现选择checkbox功能,点击checkobx的时候阻止冒泡事件, jquery给checkbox添加checked属性或去掉checked属性不能使checkobx改变状态
给tr添加点击事件,使用find方法查找tr下的所有层级的元素,children只查找下一层级的元素,所以使用find.find的返回值为jquery对象,在这个项目中不知道为什么使用jquery给c ...
- vue 事件上加阻止冒泡 阻止默认事件
重点 vue事件修饰符 <!-- 阻止单击事件冒泡 --> <a v-on:click.stop="doThis"></a> <!-- 提 ...
- html如何点击子元素事件而不触发父元素的点击事件——阻止冒泡
如果子元素和父元素都有点击事件,会出现点击事件冒泡的情况. 1.如何避免冒泡: html: <html> <head></head> <body> &l ...
- angular 点击事件阻止冒泡及默认行为
经常遇到场景:多层级元素绑定ng-click 事件,则底层元素的点击事件存在冒泡现象,怎么解决? 类似原生JS ,只是语法稍有不同,如下: 阻止冒泡 $event.stopPropagation() ...
- label 阻止冒泡 防止点击label 触发2次事件
// 必须要把 jnput的外面的label加上事件阻止冒泡,否则点击label的时候,会冒泡到input上 再次触发input的点击事件 $('.xt_order_cleft_modb_rl_dx' ...
随机推荐
- Ubuntu常用工具和问题整理
安装Ubuntu虚拟机时常会遇到的几个问题 1.安装时设置镜像 安装Ubuntu系统时设置国内镜像可以加快安装速度:http://mirrors.aliyun.com/ubuntu/ 参考:ubunt ...
- Hi3516开发笔记(九):在QtCreator开发环境中引入海思sdk的bsp包,运行显示Qt界面
前言 之前启动Qt界面程序失败了,是因为需要引入HiSDK的BSP中的HiMPP,并对HiMPP进行初始化设置. 在sdk中查询海思SDK头文件和库 在Qt中调用海思BSP 在 ...
- django中信号
# 信号的理解 在某个行为进行的某个阶段给这个行为添加一个附带的行为 # 相关api ## 数据表 pre_init # django的model执行其构造方法前,自动触发 post_init # d ...
- 【NLP学习其3.5】词嵌入的特性,为什么词之间会有联系?
词嵌入的特性 现在你有了一堆嵌入向量,我们可以开始学习他们之间的特性了 前情提要:https://www.cnblogs.com/DAYceng/p/14962528.html 先把各向量重新命名便于 ...
- 【Azure 应用服务】Azure Function 不能被触发
问题描述 Azure Function 不能被Postman 触发,错误信息如下: Error: write EPROTO 4020778632:error:100000f7:SSL routines ...
- 【Azure 应用服务】本地Git部署Java项目到App Server,访问无效的原因
问题描述 在App Server的部署中心配置好本地Git 仓库 并推送 git push azure master 分支代码到服务器时,并未发生错误 ,但是服务异常,无法访问到正确的项目文件,始终打 ...
- 主流开源分布式图计算框架 Benchmark
本文由美团 NLP 团队高辰.赵登昌撰写,首发于 Nebula Graph Community 公众号 前言 随着近年来数据的爆炸式增长,如何高效地分析处理数据,在业界一直备受关注.现实世界中的数据往 ...
- Ubuntu中安装使用QEMU/KVM/virt-manager运行虚拟机
本文为原创,原文发布于个人博客网站:Ubuntu中安装使用QEMU/KVM/virt-manager运行虚拟机 有时候我们需要在同一台计算机中使用多种不同操作系统环境,基于已有的同一堆硬件资源来获得不 ...
- Program type already present: com.xxx
该错误是由于工程中存在着相同的类导致(包名与类名都相同),有可能是不同的依赖中有着相同的类,全局搜索该类便可得知
- C++ mySQL数据库连接池(windows平台)
C++ MySQL数据库连接池 新手学了C++多线程,看了些资料练手写了C++数据库连接池小项目,自己的源码地址 关键技术点 MySQL数据库编程.单例模式.queue队列容器.C++11多线程编程. ...