javascript 阻止事件冒泡 cancelBubble

javascript简单的阻止事件冒泡,可以使用事件的cancelBubble方法为true;

html部分

<button id="btn1">点击显示div</button>
<div id="showDiv">
    显示了
</div>

 

js部分

window.onload = function(){
    var btn1 = document.getElementById("btn1");
    var showDiv = document.getElementById("showDiv");
    btn1.onclick = function(ev){
        var oEvent = ev || event;
        showDiv.style.display = "block";
        //阻止时间冒泡
        oEvent.cancelBubble = true;
    }
    document.onclick = function(){
        showDiv.style.display = "none";
    }
}

 

posted @ 2017-10-23 10:29  进击的小牛牛  阅读(1273)  评论(0编辑  收藏  举报