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

你可能感兴趣的文章
npm入门,这篇就够了
查看>>
npm切换到淘宝源
查看>>
npm切换源淘宝源的两种方法
查看>>
npm前端包管理工具简介---npm工作笔记001
查看>>
npm包管理深度探索:从基础到进阶全面教程!
查看>>
npm升级以及使用淘宝npm镜像
查看>>
npm发布包--所遇到的问题
查看>>
npm发布自己的组件UI包(详细步骤,图文并茂)
查看>>
npm和package.json那些不为常人所知的小秘密
查看>>
npm和yarn清理缓存命令
查看>>
npm和yarn的使用对比
查看>>
npm如何清空缓存并重新打包?
查看>>
npm学习(十一)之package-lock.json
查看>>
npm安装 出现 npm ERR! code ETIMEDOUT npm ERR! syscall connect npm ERR! errno ETIMEDOUT npm ERR! 解决方法
查看>>
npm安装crypto-js 如何安装crypto-js, python爬虫安装加解密插件 找不到模块crypto-js python报错解决丢失crypto-js模块
查看>>
npm安装教程
查看>>
npm报错Cannot find module ‘webpack‘ Require stack
查看>>
npm报错Failed at the node-sass@4.14.1 postinstall script
查看>>
npm报错fatal: Could not read from remote repository
查看>>
npm报错File to import not found or unreadable: @/assets/styles/global.scss.
查看>>