首页 > Web开发 > 详细

HTML DOM-->事件对象(阻止冒泡、阻止默认行为)

时间:2020-05-04 23:20:58      阅读:103      评论:0      收藏:0      [点我收藏+]

1.阻止冒泡:

   stopPropagation()

  举例:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>js_excise</title>    
    </head>

    <body>
        <div id="box1" style="background-color: #00FFFF;width: 70px;height: 70px;">
        </div>
        <input type="text" id="box2">
        <script type="text/javascript">
            document.body.onclick=function(){
                this.style.backgroundColor=yellow
            }
            
            document.getElementById(box1).onclick= function(e){
                var ev = e || window.event
                //阻止冒泡
                ev.stopPropagation()
                this.style.backgroundColor = pink
            }
            
            document.getElementById(box2).onclick = function(e){
                var ev = e || window.event
                //阻止冒泡
                ev.stopPropagation()
            }

        </script>
    </body>
</html>

  输出:body元素背景不会变成黄色

技术分享图片

 

HTML DOM-->事件对象(阻止冒泡、阻止默认行为)

原文:https://www.cnblogs.com/abner-pan/p/12828631.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!