事件流:
当一个元素接收到一个触发事件(如:onclick....)的时候,除了会触发自己的相对应要执行的事件之外,还会把它接收到的所有的触发事件传递给他的父级,那么它的父级也就接收到了子级传递过来的相对应的触发事件,父级相对应的执行事件执行完之后,按照同样的规律向上继续传递,触发事件会一直向上传递,直至document。
这种向上传递的机制叫做:事件冒泡。
阻止事件冒泡:
event下有一个cancelBubble属性,其意义为:是否阻止冒泡事件,默认值是false(不阻止)。
cancelBubble:ture; 阻止事件冒泡 (默认值是:false 不阻止事件冒泡)
要阻止事件冒泡,就在开始触发事件的这个事件监听函数下加上下列代码:
event.cancelBubble = true;
event也有兼容性(firefox浏览器),在火狐浏览器下要写
ev.stopPropagation();
下面是例子:
div.onclick = function(ev){
alert('开始冒泡');
if (ev) {
ev.stopPropagation();
}else{
event.cancelBubble = true;
};
};
有嵌套关系,并且两者都有相同的触发事件(触发后所要执行的事件可以不相同),触发子级时,自己的执行事件完成后会继续会触发其父级,进而把父级该触发事件所对应的执行事件也执行了,执行完之后如果还有父级,会继续往上触发,直到document。