js中阻止事件冒泡

淩亂°似流年 2022-01-14 06:05 285阅读 0赞

[2019独角兽企业重金招聘Python工程师标准>>> ][2019_Python_] ![hot3.png][]

<html>
            <head>
                    <title>js阻止时间冒泡</title>
            </head>
            <style>
                    #bubble{width:300px;height:300px;background:red;}
                    #bubble2{width:200px;height:200px;background:green;}
                    #bubble3{width:100px;height:100px;background:blue;}
            </style>
            <body>
                    <div id="bubble" onclick="bubble(this, event)">
                    <div id="bubble2" onclick="bubble(this, event)">
                            <div id="bubble3" onclick="bubble(this, event)">this one</div>
                                    this two
                            </div>
                            this three
                    </div>
            <body>
    </html>
    <script>
        //阻止事件冒泡
        function stopEventBubble(event){
            var e=event || window.event;
            if (e && e.stopPropagation){
                e.stopPropagation();
            }
            else{
                e.cancelBubble=true;
            }
        }
        
        function bubble(obj, evt){
            alert(obj.id);
            stopEventBubble(evt);
        }
    </script>

转载于:https://my.oschina.net/tpythoner/blog/473925

[2019_Python_]: https://my.oschina.net/u/2663968/blog/3061697
[hot3.png]: /images/20220114/e8346494e816475f8b60ca10d1394de5.png

发表评论取消回复

表情：

评论列表（有 0 条评论，285人围观）

还没有评论，来说两句吧...

相关阅读

相关 Js、Vue阻止事件冒泡行为

目录 Js阻止事件冒泡行为 Vue阻止事件冒泡行为 -------------------- 以下是Js阻止事件冒泡行为 event.stopPropagatio

忘是亡心i/ 2024年04月07日 15:23/ 0 赞/ 71 阅读

相关 JS如何阻止事件冒泡

<%@ Page Language="C" AutoEventWireup="true" CodeFile="Default5.aspx.cs"Inherits=

叁歲伎倆/ 2023年06月01日 12:52/ 0 赞/ 3 阅读

相关 JS_js阻止事件冒泡的方法

阻止方法有三种： 1、event.stopPropagation(); document.querySelector("login").addEventList

你的名字/ 2023年01月16日 14:26/ 0 赞/ 221 阅读

相关 Js 冒泡事件阻止

出于对作者的尊重和感谢，原文地址为 http://www.cnblogs.com/jams742003/archive/2009/08/29/1556187.html

Bertha 。/ 2022年09月24日 00:29/ 0 赞/ 246 阅读

相关 js jquery阻止冒泡事件

event.stopPropagation(); -- 阻止元素冒泡事件注：嵌套元素一般都存在冒泡事件，会带来某些影响例：<div id="c1" οnclick="

╰+攻爆jí腚メ/ 2022年08月20日 07:27/ 0 赞/ 188 阅读

相关 js阻止事件冒泡

function stopHandler(event){ window.event?window.event.cancelBubble=true:eve

古城微笑少年丶/ 2022年07月13日 00:48/ 0 赞/ 263 阅读

相关 js中阻止事件冒泡与阻止事件默认行为

一、冒泡事件我们都知道冒泡就像水底气泡浮到水面这一过程。冒泡事件即是事件从最底层逐个经过上面一级级事件的过程，就是冒泡事件。那么如何有效的阻止冒泡事件的发生？其实在非I

雨点打透心脏的1/2处/ 2022年05月30日 06:13/ 0 赞/ 317 阅读

相关前端js阻止事件冒泡

-------------------- title: 前端js阻止事件冒泡 date: 2018-4-21 20:27:24 tags: \[js\] categor

电玩女神/ 2022年04月12日 09:47/ 0 赞/ 260 阅读

相关 js中阻止事件冒泡

[2019独角兽企业重金招聘Python工程师标准>>> ][2019_Python_] ![hot3.png][] <html> <head

淩亂°似流年/ 2022年01月14日 06:05/ 0 赞/ 286 阅读

相关 JS阻止事件冒泡和默认事件

本文转载自掘金中我的小伙伴的一篇文章：[https://juejin.im/post/5bf7ad096fb9a049ed308353][https_juejin.im_pos

妖狐艹你老母/ 2021年11月22日 12:46/ 0 赞/ 458 阅读