事件流---描述的是从页面接收事件的顺序,或者是事件的传播顺序。此类详细介绍的文章很多,就不再赘述,此处只简单介绍一些对于事件流的兼容处理方式。
一、前导知识
我们都知道函数调用时系统会自动传入一个event,要处理事件流,必须先要获取event,这一步骤也存在兼容问题。
event 兼容高级浏览器
window.event 兼容非火狐
获取event的兼容写法
function(ev){
var Event = ev||event;
}
二、事件处理
1、事件冒泡处理
事件冒泡是指元素触发事件后,事件没有中断,会向上传播,如果父级有相同的事件,(结构)父级也会触发,如果没有,则向上传递到document。这里我们要用到
Event.cancelBubble 都兼容 设置是否阻止事件冒泡,可设false或true
Event.stopPropagation() 兼容高级浏览器 作用是阻止事件传播
兼容写法
if(Event.stopPropagation){
Event.stopPropagation();
}else{
Event.canselBubble = true;
}
2、如何禁止浏览器默认事件
Event.preventDeafault();兼容高级浏览器
Event.returnValue = false; 兼容IE
return false; 都兼容
兼容写法
if(Event.preventDeafaut){
Event.preventDeafault()
}else{
Event.returnValue = false;
}
3、获取事件源头
Event.target 兼容高级浏览器
Event.srcElement 兼容非火狐
兼容写法
var oSrc;
if(Event.target){
oSrc = Event.target;
}else{
oSrc = Event.srcElement ;
}