博客
关于我
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/

你可能感兴趣的文章
Vue3+element plus+sortablejs实现table列表拖拽
查看>>
Nokia5233手机和我装的几个symbian V5手机软件
查看>>
non linear processor
查看>>
Non-final field ‘code‘ in enum StateEnum‘
查看>>
none 和 host 网络的适用场景 - 每天5分钟玩转 Docker 容器技术(31)
查看>>
None还可以是函数定义可选参数的一个默认值,设置成默认值时实参在调用该函数时可以不输入与None绑定的元素...
查看>>
NoNodeAvailableException None of the configured nodes are available异常
查看>>
Vue.js 学习总结(16)—— 为什么 :deep、/deep/、>>> 样式能穿透到子组件
查看>>
nopcommerce商城系统--文档整理
查看>>
NOPI读取Excel
查看>>
NoSQL&MongoDB
查看>>
NoSQL介绍
查看>>
NoSQL数据库概述
查看>>
Notadd —— 基于 nest.js 的微服务开发框架
查看>>
NOTE:rfc5766-turn-server
查看>>
Notepad ++ 安装与配置教程(非常详细)从零基础入门到精通,看完这一篇就够了
查看>>
Notepad++在线和离线安装JSON格式化插件
查看>>
notepad++最详情汇总
查看>>
notepad++正则表达式替换字符串详解
查看>>
notepad如何自动对齐_notepad++怎么自动排版
查看>>