由于,存在IE这种奇葩的浏览器存在,导致DOM中的许多的方法,和别的浏览器不一样。所以跨浏览器是很有必要的。下面给出事件对象和事件方法的解决方案,源码来自《javascript高级程序设计》一书。
//跨浏览器事件方法.
var EventUtil={
addHandler:function(element,type,handler){
if(element.addEventListener){
element.addEventListener(type,handler,false);
}else if(element.attachEvent){
element.attachEvent("on"+type,handler);
}else{
element["on"+type]=handler;
}
}
,
removeHandler:function(element,type){
handler=function(){
}
if(element.removeEventListener){
element.removeEventListener(type,handler,false);
}else if(element.detachEvent){
element.detachEvent("on"+type,handler);
}else{
element["on"+type]=null;
}
}
,
//跨浏览器事件对象
getEvent:function(){
return event?event:window.event;
}
,
getTarget:function(event){
return event.target||event.srcElement;
}
,
preventDefault:function(event){
if(event.preventDefault){
event.preventDefault();
}else{
event.returnValue=false;
}
}
,
stopPropagation:function(event){
if(event.stopPropagation){
event.stopPropagation();
}else{
event.cancelBubble=true;
}
}
};
这样在,通过调用对象中的方法可以解决跨浏览器的问题,例如:我要为一个按钮添加一个onclick事件处理程序,我就可以这样写:
var btn=document.getElementById("mybtn");
EventUtil.addHandler(btn,"click",function(){alert("hellow world");});