博客
关于我
js点击事件禁止冒泡
阅读量:573 次
发布时间:2019-03-10

本文共 605 字,大约阅读时间需要 2 分钟。

对于$.car-style绑定的点击事件,在callback函数内部调用event.stopPropagation();即可有效阻止事件冒泡。这种方法在jQuery事件处理中是一个常见的操作。以下是具体实现代码:

$(".car-style").click(function() {    $(".operate-mask-outer").show();});

当页面上存在多个拦车点或需要同时处理的事件时,使用stopPropagation可以避免事件传递到子元素。例如,点击黄色禁停站时,避免事件传递到$(".operate-mask-outer")

$("#operateMask").click(function() {    $(".operate-mask-outer").hide();});

在处理某些特定元素的点击时,为了防止事件继续trigger到父元素,可以通过stopPropagation方法阻止。至于stopover-station类绑定的点击事件,可以通过以下方式实现阻止冒泡:

$(".stopover-station").click(function(event) {    event.stopPropagation();    // 克服弹出框外部点击触发的事件    // 并继续执行当前绑定的逻辑});

这种方式不仅可以处理窗口顶层,但也适用于内部嵌套的Dom元素。

转载地址:http://xbbvz.baihongyu.com/

你可能感兴趣的文章
postgresql基本使用
查看>>
PostgreSQL学习总结(10)—— PostgreSQL 数据库体系架构
查看>>
PostgreSQL学习总结(11)—— PostgreSQL 常用的高可用集群方案
查看>>
Qt开发——多线程网络时间客户端
查看>>
PostgreSQL学习总结(13)—— PostgreSQL 15.8 如何成就数据库性能王者?
查看>>
PostgreSQL学习总结(13)—— PostgreSQL 目录结构与配置文件 postgresql.conf 详解
查看>>
PostgreSQL学习总结(1)—— PostgreSQL 入门简介与安装
查看>>
PostgreSQL学习总结(2)—— PostgreSQL 语法
查看>>
PostgreSQL学习总结(3)—— PostgreSQL 数据类型
查看>>
Qt开发——圆面积计算器
查看>>
PostgreSQL学习总结(5)—— PostgreSQL table 创建与删除
查看>>
PostgreSQL学习总结(6)—— PostgreSQL 模式(SCHEMA)详解
查看>>
PostgreSQL学习总结(7)—— PostgreSQL 语句 INSERT INTO、SELECT、UPDATE、DELETE 等学习
查看>>
PostgreSQL学习总结(8)—— PostgreSQL 基于数据库和基于模式(schema)的多租户分析
查看>>
PostgreSQL学习总结(9)—— PostgreSQL 运算符与表达式
查看>>
PostGreSql学习笔记001---PostgreSQL10.4安装(Windows)_支持PostGreGis_PostJDBC
查看>>
PostGreSql学习笔记002---Navicat Premium中管理PostGreSql 错误:字段rolcatupdate 不存在
查看>>
PostgreSQL学习笔记:PostgreSQL vs MySQL
查看>>
PostgreSQL实现shape数据转geojson数据(地图工具篇.18)
查看>>
PostgreSQL导入shape数据(地图工具篇.10)
查看>>