1.事件冒泡:在一个对象上产生了一个事件例如click事件,该事件程序处理完成之后,会向这个对象的父级对象传播,直到它被处理(所有父级同类事件都被激活)
例如:
<div οnclick="openWin('http://www.baidu.com')" id="outSide" style="width:100px; height:100px; background:#000; padding:50px">
<div οnclick="openWin('http://www.google.com')" id="inSide" style="width:100px; height:100px; background:#CCC"></div>
</div>
点击outSide会打开baidu.com
点击inSide会打开google、baidu
inSide就产生了事件冒泡
2.注意项:不是所有事件都支持冒泡,以下事件不冒泡:blur、focus、load、unload
3.组织事件冒泡:
a.原生js校验
//阻止事件冒泡函数 function stopBubble(e) { if (e && e.stopPropagation) e.stopPropagation() else window.event.cancelBubble=true }
b.基于jquery
$("#div").bind("click",function(event){ if(event.target.id == this.id) alert("click"); })