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' ...
随机推荐
- win32 - 使用LookupAccountName查找SID
可以使用LookupAccountNameA获取sid. LookupAccountName函数接受系统名称和帐户作为输入.它检索该帐户的安全标识符(SID)以及在其上找到该帐户的域的名称. 使用此a ...
- Redis能保证数据不丢失吗?
大家即使没用过Redis,也应该都听说过Redis的威名. Redis是一种Nosql类型的数据存储,全称Remote Dictionary Server,也就是远程字典服务器,用过Dictionar ...
- 【Android 逆向】【攻防世界】app2
1. 手机安装apk,随便点击,进入到第二个页面就停了 2. jadx打开apk,发现一共有三个activity,其中第三个activity: FileDataActivity 里面有东西 publi ...
- 【LeetCode回溯算法#09】全排列,排列问题以及其中涉及的去重操作
全排列 力扣题目链接 给定一个不含重复数字的数组 nums ,返回其 所有可能的全排列 .你可以 按任意顺序 返回答案. 示例 1: 输入:nums = [1,2,3] 输出:[[1,2,3],[1, ...
- 【C++ OOP 02 对象的初始化和清理】构造/析构函数、深/浅拷贝、初始化列表以及静态成员
[对象的初始化和清理] 生活中我们买的电子产品都基本会有出厂设置,在某一天我们不用时候也会删除一些自己信息数据保证安全 C++中的面向对象来源于生活,每个对象也都会有初始设置以及 对象销毁前的清理数据 ...
- 数据结构(三):舞伴配对问题(C++,队列)
好家伙, 题目如下: 1.舞伴配对问题:假设在周末舞会上,男士们和女士们进入舞厅时,各自排成一队.跳舞开始时,依次从男队和女队的队头上各出一人配成舞伴. 2.若两队初始人数不相同,则较长的那一队中未配 ...
- 【Azure API 管理】API Management 访问限制策略[quota-by-key] 中参数 [renewal-period] 的实验和理解
quota-by-key 策略允许根据密钥强制实施可续订或有生存期的调用量和/或带宽配额. 密钥的值可以是任意字符串,通常使用策略表达式来提供密钥. 可以添加可选增量条件,指定应在配额范围内的请求. ...
- C++11的类型转换
//C类型转换 /* C语言:显式和隐式类型转换 隐式类型转化:编译器在编译阶段自动进行,能转就转,不能转就编译失败 显式类型转化:需要用户自己处理. 隐式类型:界定:相关类型,相近类型,意义相似的类 ...
- 分组聚合不再难:Pandas groupby使用指南
处理大量数据时,经常需要对数据进行分组和汇总,groupby为我们提供了一种简洁.高效的方式来实现这些操作,从而简化了数据分析的流程. 1. 分组聚合是什么 分组是指根据一个或多个列的值将数据分成多个 ...
- Java 一悟结束异常处理 Biu丶