javaScript小点..

阻止事件冒泡

function stopBubble(e){
if(e&&e.stopPropagation){//非 IE
e.stopPropagation();
}
else{//IE
window.event.cancelBubble=true;
}
}

 

阻止默认事件

function stopDefault( e ) {
//阻止默认浏览器动作(W3C)
if ( e && e.preventDefault )
e.preventDefault();
//IE 中阻止函数器默认动作的方式
else
window.event.returnValue = false;
return false;
}

 

 

事件委托

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<style>
    #oul li{
        display: block;
        width: 600px;
        height: 50px;
        background-color: rgba(0,0,0,0.3);
        margin: 20px;
    }
</style>
<body>
    <ul id="oul">
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
    </ul>

    <script>
        var ul = document.querySelector("#oul");

        ul.onclick = function (ev){

            var ev = ev || window.event;

            var target = ev.target || ev.srcElement;

            if(target.nodeName.toLowerCase() == "li"){

                alert("123")
            }

            //alert("123")


        }

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

 

posted @ 2017-12-21 15:52  高煜  阅读(108)  评论(0)  编辑  收藏  举报