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' ...
随机推荐
- MyBaits查询MySQL日期类型结果相差8个小时
问题描述 在Java项目中使用MyBatis作为ORM框架,但是查询出的MySQL日期类型字段值总是比数据库表里的值多8个小时. 具体说明: MySQL数据库表字段类型为timestamp,映射的Ja ...
- SSH 客户端
简介 OpenSSH 的客户端是二进制程序 ssh.它在 Linux/Unix 系统的位置是/usr/local/bin/ssh. Linux 系统一般都自带 ssh,如果没有就需要安装. # Ubu ...
- 【LeetCode回溯算法#04】组合总和I与组合总和II(单层处理位置去重)
组合总和 力扣题目链接(opens new window) 给定一个无重复元素的数组 candidates 和一个目标数 target ,找出 candidates 中所有可以使数字和为 target ...
- 4-request对象
前端提交数据 必备知识点 前端form表单中action属性,不写默认是当前路由地址 前端form表单中的method属性,不写默认是GET请求 前端页面 templates\register.htm ...
- 【Azure Developer】Go语言调用Azure SDK如何登录到中国区Azure环境
问题描述 在 "使用 Azure SDK for Go 进行 Azure 身份验证" 文章中的 Go 示例代码进行登录Azure时,默认指向的是Globa Azure.当只修改AA ...
- 【Azure 存储服务】Blob中数据通过Stream Analytics导出到SQL/Cosmos DB
问题描述 Json格式的数据目前是存储在Azure Blob中,如何将这些数据Load到Sql DB和CosmosDB中呢? 测试方案 使用Azure流分析服务(Stream Analytics)功能 ...
- 将windows上socket的client程序修改到linux上运行
将windows上客户端程序修改到linux上运行 记录一下修改哪些地方 编译命令 文件夹的内容:包含了client.cpp mySocket.cpp mySocket.h until.h 链接在一起 ...
- RPA能否创造新业态?如何优化组织结构?如何助力疫情中的企业?
RPA能否创造新业态?如何优化组织结构?如何助力疫情中的企业? 从<爱,死亡和机器人>探讨强人工智能时代的RPA发展 文/王吉伟 本周四,王吉伟频道参加了私域流量社群的一个直播活动. 活动 ...
- 2、mysql存储引擎
存储引擎 1 存储引擎概述 和大多数的数据库不同, MySQL中有一个存储引擎的概念, 针对不同的存储需求可以选择最优的存储引擎. 存储引擎就是存储数据,建立索引,更新查询数据等等技术的实现方式 .存 ...
- 上来就对标 20k Star 的开源项目,是自不量力还是后起之秀?
先来一段紧箍咒:nvm.fvm.gvm.sdkman.fnm.n.g.rvm.jenv.phpbrew.rustup.swiftenv.pyenv.rbenv... 这些都是用来解决编程语言多版本管理 ...