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' ...
随机推荐
- ASP.NET 跨域配置
报错信息 The 'Access-Control-Allow-Origin' header is present on the requested resource 解决方案 web.config配置 ...
- GPS坐标系转换 go golang 版本
GPS坐标系转换 坐标系 解释 WGS84坐标系 地球坐标系,国际通用坐标系 GCJ02坐标系 火星坐标系,WGS84坐标系加密后的坐标系:Google国内地图.高德.腾讯地图 使用 BD09坐标系 ...
- Google Test Adapter安装
背景 我有一个vs2015 的gtest 工程,编译完成后,需要gtest adapter帮我把测试列表显示出来,但是通过vs自带的工具或者网页下载安装遇到2个问题: 1.下载速度超级慢,慢到我能到火 ...
- Mysql 删除binlog日志方法
方法1 RESET MASTER; 解释: 该方法可以删除列于索引文件中的所有二进制日志,把二进制日志索引文件重新设置为空,并创建一个以.000001为后缀新的二进制日志文件. 该语法一般只用在主从环 ...
- 【Azure 事件中心】在Azure Function App中消费Event Hub数据,时常出现EventReceiveError
问题描述 在Azure Function App中消费Event Hub数据,时常出现EventReceiveError:New receiver 'P3-00122a562-4fa4-7f3f-ad ...
- 使用 RKE 方式搭建 K8s 集群并部署 NebulaGraph
本文由社区用户 Albert 贡献,首发于 NebulaGraph 论坛,旨在提供多一种的部署方式使用 NebulaGraph. 在本文,我将会详细地记录下我用 K8s 部署分布式图数据库 Nebul ...
- 智能升级:AntSK教你如何让聊天机器人实现智能联网操作
随着人工智能技术的飞速发展,智能体已经逐步融入到我们的日常生活中.不过,要想让智能体不仅能聊天,还能接入网络实时获取信息,为我们提供更多便利,所需技术的复杂性不得不让人瞩目.今天,我将和各位分享如何在 ...
- Codeforces Round 260 (Div. 1)A. Boredom(dp)
最开始写了一发贪心wa了,然后这种选和不选的组合优化问题,一般是考虑动态规划 \(dp[i][0]:\)表示第i个数不选的最大值 \(dp[i][1]:\)表示第i个数选的最大值 考虑转移: \(dp ...
- 【容斥、状压dp】主旋律 题解
[清华集训2014]主旋律 题解 神秘题. 题目简述 给你一个有向图 \(G=(V,E)\).求有多少 \(E\) 的子集 \(E'\) 使得新图 \(G'=(V,E')\) 是强连通图. 强连通图的 ...
- Github无法读取远程仓库
主页 个人微信公众号:密码应用技术实战 个人博客园首页:https://www.cnblogs.com/informatics/ Git无法访问 今早起来访问Github炸了,Git不能用了,提示: ...