冒泡事件

一、基本事件

  $(".child").click(function(){
                console.log(0)
            })

            $(".child").mousemove(function(){
                console.log(e.offsetX,e.offsetY)
            })
            $(".child").mouseover(function(){
                $(this).css("background-color:plum;")
            }).mouseout(function(){
                $(this).css(" background-color: powderblue;");
            })
            
            $(".child").hover(function(){
                $(this).css("background-color: salmon;");
            },function(){
                $(this).css(" background-color: seagreen;");
            })

二、jQuery  阻止冒泡事件

e.stopPropagation();  //阻止事件冒泡
e.preventDefault();   // 阻止默认行为  reset submit  a[href]
return false;    •停止回调函数执行并立即返回。 
 // 阻止事件冒泡
            function stopPropagation(e){
                e.stopPropagation();  //阻止事件冒泡
                /* e.preventDefault();   // 阻止默认行为  reset submit  a[href] */
                return false;
            }

            $(".child").click(function(e){
                /* e.stopPropagation();  //阻止事件冒泡
                e.preventDefault();   // 阻止默认行为  reset submit  a[href]
                return false; */
                console.log(".child")
                return stopPropagation(e);
            }) 
            $(".parent").click(function(){
                console.log(".parent")
            })

三、鼠标事件

 

 

posted @ 2021-11-11 08:21  .Nice  阅读(57)  评论(0)    收藏  举报