当前位置: 首页 > news >正文

解决:事件监听器 addEventListener 被多次调用

背景:

给一个元素添加了事件监听,click 会触发
然而在实际场景中,点击一次,事件会被触发两次
阻止冒泡也没有用

解决:

使用API:event.stopImmediatePropagation()
stopImmediatePropagation() 方法可防止调用同一事件的其他侦听器。
API 举例说明:
单击按钮时,执行第一个事件处理程序,并停止执行其余的事件处理程序:

var x = document.getElementById("myBtn");
x.addEventListener("click", myFunction);
x.addEventListener("click", someOtherFunction);function myFunction(event) {alert ("Hello World!");event.stopImmediatePropagation();
} // 这个函数不会被执行
function someOtherFunction() {alert ("I will not get to say Hello World"); 
}
http://www.lryc.cn/news/404264.html

相关文章:

  • 配置RIPv2的认证
  • 前端调试技巧:动态高亮渲染区域
  • 深克隆与浅克隆的区别与实现
  • 【学习笔记】无人机系统(UAS)的连接、识别和跟踪(六)-无人机直接C2通信
  • 认识和安装R的扩展包,什么是模糊搜索安装,工作目录和空间的区别与设置
  • 解决STM32开启定时器时立即进入一次中断程序问题
  • Unity UGUI 之EventSystem
  • USB转多路UART - USB 基础
  • 接近50个实用编程相关学习资源网站
  • 在数据操作中使用SELECT子句
  • Golang | Leetcode Golang题解之第274题H指数
  • 区块链技术在智能家居中的创新应用探索
  • 无需业务改造,一套数据库满足 OLTP 和 OLAP,GaiaDB 发布并行查询能力
  • PHP 表单验证:邮件和URL
  • 前端八股文 路由的懒加载
  • HarmonyOS Web组件(二)
  • HarmonyOS应用开发者高级认证,Next版本发布后最新题库 - 单选题序号2
  • 基于python深度学习遥感影像地物分类与目标识别、分割实践技术应用
  • 叶再豪降龙精英课程总结
  • 算法 - 查找算法(顺序、折半、红黑树、AVL树、B+树、散列)
  • TCP与UDP网络编程
  • 媲美Midjourney-v6,Kolors最新文生图模型部署
  • 深度学习程序环境配置
  • 【STM32 HAL库】全双工I2S+双缓冲DMA的使用
  • 【Spring Boot】网页五子棋项目中遇到的困难及解决方法
  • 营销策划方案模板
  • Python入门基础教程(非常详细)
  • LeetCode 常见题型汇总
  • el-select选择器修改背景颜色
  • Shell程序设计