(function(){
var mydiv = document.getElementById('mydiv'); //需要展示和隐藏的层
var btn = document.getElementById('btn'); //控制按钮
document.onclick = function(){ //给整个document绑定click事件,隐藏div
mydiv.style.display = 'none';
}
btn.onclick = function(event){ //点击按钮展示div层
mydiv.style.display = 'block';
event.stopPropagation(); //取消事件冒泡行为,避免触发绑定在document上的click事件
}
mydiv.onclick = function(event){ //div上子元素的点击事件
if(event.target.tagName.toLowerCase() == 'a'){
alert(event.target.text);
}
event.stopPropagation(); //取消事件冒泡行为,避免触发绑定在document上的click事件
}
})();
事件冒泡在层的展示和隐藏中的应用
最新推荐文章于 2024-09-09 12:27:46 发布