onclick 阻止冒泡

最新推荐文章于 2023-12-28 11:37:40 发布
最新推荐文章于 2023-12-28 11:37:40 发布
阅读量1.5k 收藏
点赞数
文章标签： html jquery
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_38394249/article/details/124130940
版权

οnclick=“delInfo();event.cancelBubble =true;”

取消事件冒泡，在 IE 的事件机制中，触发事件会从子元素向父元素逐级上传，就是说，如果子元素触发了单击事件，那么也会触发父元素的单击事件；event.cancelBubble=true;可以停止事件继续上传
补充一点，Ie的事件传递是从下到上的：

事件来源对象->上级对象->上上级对象->…->body->document->window

NS的事件传递是从上到下：

window->document->body->…->事件来源对象

⁣ ⁣⁣⁣⁣ ⁣⁣⁣⁣ ⁣⁣
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
阻止事件冒泡和围绕.on()方法 [.selector]事件委托中冒泡情况的探讨
Alcantara的博客
10-04 2663
2019-7-23更新： 1. document和body代理事件，在某些浏览器无效，目前发现在微信浏览器无效。 2. 前端使用模板引擎渲染的节点，可能滞后与事件的绑定，因此这种情况下最适合事件代理。 一、事件冒泡和阻止事件冒泡 事件冒泡是JavaScript的核心概念之一，它的原理很简单，但真正应用起来还是有不少的坑。 这里说一说关于阻止事件冒泡的本质。 我们都知道阻止事件冒泡...
React冒泡和阻止冒泡的应用详解
11-19
在React开发中，事件处理是不可或缺的一部分，而事件冒泡和阻止冒泡是理解JavaScript事件模型的关键概念。事件冒泡是指事件从最深的节点开始，逐级向上传播到最外层节点的过程。在React中，由于其事件处理机制，理解...
React onClick 事件阻止冒泡
最新发布
天问博客-专注于大前端技术
12-28 1411
在 React 中，你可以通过使用 onClick 事件来处理点击事件，并且可以通过在事件处理函数中调用 stopPropagation() 方法来阻止事件冒泡。本文将为你提供 类组件 和 函数式组件 两种示例。
jquery onclick绑定的方法阻止事件冒泡
weixin_44540711的博客
08-18 2934
记录一下，自己经常忘记老去百度 使用jquery onclick绑定的方法中要阻止事件冒泡其实非常简单，只需要传递一个参数即可，代码如下 <a target="_blank" href="http://www.baidu.com" class="annex-p" data-annex="baidu">点我去百度<i onclick="delAnnex(event)">关闭</i></a> <script> function delAnn.
JS点击事件，阻止事件冒泡
zyynb的博客
06-06 6296
点击事件冒泡 例1:添加事件监听器 首先画一个div绑定点击事件来了解添加事件监听器方法 <div id="demo" style="width: 300px;height: 300px; background: black;"> demo </div> 获取这个div然后绑定两个点击事件，此时点击只会打印(222),后出现的方法覆盖了前面的 let demo = document.querySelector('#demo') demo.onclick = functio
浅谈javascript事件取消和阻止冒泡
10-24
在处理事件时，有时我们需要阻止事件的默认行为或者避免事件的冒泡，这就是所谓的事件取消和阻止冒泡。 首先，让我们来理解什么是事件取消。事件取消的目标是防止浏览器执行与特定事件相关的默认行为。例如，当用户...
JavaScript阻止事件冒泡示例分享
10-24
将这个函数添加到需要阻止冒泡的事件处理函数内部即可实现预期效果。 总的来说，理解和熟练运用`event.stopPropagation()`、`event.cancelBubble`以及`event.preventDefault()`是编写健壮的JavaScript事件处理程序...
JavaScript捕捉事件和阻止冒泡事件实例分析
12-03
本文通过实例分析了如何在JavaScript中捕捉事件以及如何阻止冒泡事件。 事件冒泡是指事件在DOM（文档对象模型）树中从最具体的节点（子节点）向上级节点（父节点）传播的过程。当一个元素发生事件，如点击（onclick...
JS阻止冒泡事件以及默认事件发生的简单方法
12-12
如果是在里面，那么呢，有一个onclick事件，也有onclick事件，为了触发的点击事件时，不触发父元素的点击事件，...如果要阻止默认事件的触发，即默认的href事件，那么就需要调用如下函数： 代码如下:function stopD
内联onclick阻止事件冒泡避坑指南
Don't lost way
03-20 4897
内联onclick事件虽然没有显式的传入event对象，但是在click事件中还是可以使用event对象的，不过这里有个细节需要注意，那就是event总是保存着最后发生的那个事件对象的信息。 所以，在处理的时候，要把握好时机。 例如： <span οnclick='clickSpan();'>点击span</span> </div> <script>...
onclick防止冒泡和json对象放入
weixin_30947043的博客
06-29 128
onclick 阻止冒泡onclick="aa_click(event,name)" function aa_click(e,name){ if ( e && e.stopPropagation ) { e.stopPropagation(); } else { window.event.cancelBubble = true; ...
取消html中onclick的事件冒泡
glsanguo的博客
07-16 1867
event.cancelBubble=true;
阻止事件冒泡的两种方法
热门推荐
zhm0303的博客
09-25 1万+
何为冒泡：       即事件开始是由最具体的元素接收，然后逐层向上级传播到较为不具体的元素。 加入一个button和它的父级div同时定义了onclick事件，点击button时，在触发了button的onclick事件之后，会发生事件冒泡，然后触发div的onclick事件，然而，触发button的onclick事件的同时也触发div的onclick事件显然不是我们想要的，此时，可以阻止冒...
js点击事件禁止冒泡
Hero_rong的博客
11-22 2463
$(".car-style").click(function(){ $(".operate-mask-outer").show(); // 点击黄色的禁停站，弹出框显示 }); $("#operateMask").click(function(){ $(".operate-mask-outer").hide(); ...
如何在js中解决阻止事件冒泡问题？
Code_King006的博客
04-06 1664
内联onclick事件虽然没有显式的传入event对象，但是在click事件中还是可以使用event对象的，不过这里有个细节需要注意，那就是event总是保存着最后发生的那个事件对象的信息。事件冒泡过程（以标签ID表示）：hr_three----> divTwo----> divOne。会发现它依次弹出：我是最里层---->我是中间层---->我是最外层，但最后却没有跳转到百度。运行页面，点击“点击我”,会依次弹出：我是最里层---->我是中间层---->我是最外层。---->然后再链接到百度.
阻止冒泡事件
weixin_67490903的博客
05-25 893
何为冒泡： 即事件开始是由最具体的元素接收，然后逐层向上级传播到较为不具体的元素。 加入一个button和它的父级div同时定义了onclick事件，点击button时，在触发了button的onclick事件之后，会发生事件冒泡，然后触发div的onclick事件，然而，触发button的onclick事件的同时也触发div的onclick事件显然不是我们想要的，此时，可以阻止冒泡事件。 方法一： event.stopPropagation(); 这个方法会阻止冒泡事件，但是不会阻止默认事件
js阻止事件冒泡
junyu1024的博客
03-27 259
需求：点击input框会弹出一个警告信息，当点击除了input框以外的部分要求让警告信息隐藏。            $(".dk_mouth_p input").click(function (e){ $(".dk_jg").toggle(); e.stopPropagation(); }) $(document)....
事件冒泡与阻止冒泡
w_t_y_y的博客
01-19 2349
一、事件冒泡： 当一个元素接收到事件的时候 会把他接收到的事件传给自己的父级，一直到window 。（注意这里传递的仅仅是事件 并不传递所绑定的事件函数。所以如果父级没有绑定事件函数，就算传递了事件 也不会有什么表现 但事件确实传递了。）且事件冒泡与位置无关，只跟html代码中的层级关系有关系。例： var div1 = document.getElementById("div1"); var div2 = document.getElementById("div2"); div2.onclick
在onclick中阻止冒泡
05-31
在 onclick 中阻止事件冒泡可以使用 `event.stopPropagation()` 方法。该方法可以防止事件在 DOM 树中继续传播，从而避免事件被其他元素捕获并触发对应的事件处理程序。 以下是一个示例代码，演示如何在onclick中阻止事件冒泡： ``` <div onclick="console.log('outer div clicked')"> <button onclick="event.stopPropagation(); console.log('button clicked')">Click me</button> </div> ``` 在上面的代码中，当用户点击按钮时，会触发名为 "button clicked" 的 JavaScript 日志，而不会触发名为 "outer div clicked" 的日志。这是因为在按钮的 onclick 中使用了 `event.stopPropagation()` 方法，防止事件在 div 元素中继续传播。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值