事件冒泡

事件流:

  当一个元素接收到一个触发事件(如: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。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值