首页  >  问答  >  正文

javascript - 是不是有的事件不支持事件冒泡?

上面是一段很简单的测试代码
如果onmouseover冒泡 就应该触发 onclick 事件 和 onmouseout事件 然而并没有发生
点击onclik事件 也没有触发 onmouseout事件
那么具体有哪些不支持冒泡的事件?

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>demo</title>
        <style type="text/css">
            *{
                margin: 0;
                padding: 0;
            }
            span{
                width: 100px;
                height: 100px;
                background: red;
                text-align: center;
                line-height: 100px;
                float: left;
            }
                
            p{
                width: 100px;
                height: 100px;
                background: blueviolet;
                text-align: center;
                line-height: 100px;
                float: left;
                display: none;
            }
            .dis{
                display: block;
            }
        </style>

    </head>
    <body>
        <p id="d">
        <span>
            点击
        </span>
        <p>浮动</p>
        </p>
    </body>
        <script>
            var d=document.getElementById('d')
            var s=document.getElementsByTagName('span')[0];
            var p=document.getElementsByTagName('p')[0];
            d.onclick=function(){
                console.log('123456789')
            }
            s.onmouseover=function(){
                p.style.display='block'; 
            }
            p.onmouseover=function(){
                p.style.display='block'; 
            }
            document.onmouseout=function(){
                p.style.display='none'; 
            }
        </script>    
</html>
ringa_leeringa_lee2732 天前887

全部回复(3)我来回复

  • PHP中文网

    PHP中文网2017-05-19 10:20:25

    你对冒泡机制的理解有问题吧。冒泡是事件在不同层级之间的传播。。。

    回复
    0
  • 伊谢尔伦

    伊谢尔伦2017-05-19 10:20:25

    例如load、unload、blur、focus、mouseleave......
    详细内容见W3C文档:文档中事件的Bubbles属性为NO的不支持冒泡

    回复
    0
  • 漂亮男人

    漂亮男人2017-05-19 10:20:25

    冒泡也得是同类型的事件,比如click只能触发click。
    事件触发机制不一样 肯定不能传播

    回复
    0
  • 取消回复