JS事件冒泡

版权声明:转载原创文章请以超链接形式请注明原文章出处,尊重作者,尊重原创!


恰饭广告




<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style type="text/css">
        .one_box{
            width: 400px;
            height: 360px;
            border: 1px solid black;
            margin: auto;
            padding: 50px;
            background: blue;
        }
        .two_box{
            width: 200px;
            height: 200px;
            border: 1px solid black;
            margin: auto;
            padding: 75px;
            background: green;
        }
        .three_box{
            width: 100px;
            height: 100px;
            border: 1px solid black;
            padding: 50px;
            background: red;
      }
 </style>
</head>
<body>
    <script type="text/javascript">
    function Outside(){
       alert("这是外部的div");
    }
    function Midddle(){
         alert("这是中间的div");
    }
    function Inside(){
         alert("这是内部的div");
    }
    </script>
    <div class="one_box" onclick="Outside()">
        <div class="two_box" onclick="Midddle()">
            <div class="three_box" onclick="Inside()"> </div>
        </div>
    </div>
</body>
</html> 

注意:事件捕获就不写了,事件捕获IE是不支持的,而且几乎不可能用到

原文链接:https://www.idaobin.com/archives/220.html

让我恰个饭吧.ヘ( ̄ω ̄ヘ)

支付宝 ——————- 微信
图片加载中图片加载中



恰饭广告

发表评论

电子邮件地址不会被公开。 必填项已用*标注

× 5 = 35