Object of Event--《Professional JavaScript for Web Developer》

在Nicholas C.Zakas'《Professional JavaScript for Web Developer》一书中，对于解决event对象兼容性问题采用了下面的方法

优点：无需过多考虑不同浏览器对event对象的差异，统一采用DOM标准调用event对象的方法和属性

跨平台的事件
1-创建Eventutil对象（util是工具的意思）

var Eventutil=new Object();
//OR var Eventutil={};

2-添加或删除事件处理函数

Eventutil.addEventHandler=function(obj,type,fnName){
    if(obj.addEventListener){//for DOM
        obj.addEventListener(type,fnName,false);
    }else if(obj.attachEvent){//for IE
        obj.attachEvent('on'+type,fnName);
    }else{//for others
        obj['on'+type]=fnName;
    }
}

Eventutil.removeEventHandler=function(obj,type,fnName){
    if(obj.removeEventListener){//for DOM
        obj.removeEventListener(type,fnName,false);
    }else if(obj.detachEvent){//for IE
        obj.detachEvent('on'+type,fnName);
    }else{//for others
        obj['on'+type]=null;
    }

}

3-格式化event对象（format格式化的意思）

Eventutil.formatEvent=function (oEvent){
    if(document.all){
        //IE字符代码用keyCode,而DOM用charCode
        oEvent.charCode=(oEvent.type=='keypress')?oEvent.keyCode:0;
        //eventphase：1-Event.CAPTURING_PHASE，2-Event.AT_TARGET，3-Event.BUBBLING_PHASE
        oEvent.eventPhase=2;
        oEvent.isChar=(oEvent.charCode>0); //存在一定的问题，慎用
        //pageX,pageY和clientX，clientY(IE no pageX/Y)
        oEvent.pageX=oEvent.clientX+document.body.scrollLeft;
        oEvent.pageY=oEvent.clientY+document.body.scrollTop;
        //阻止默认行为，IE:returnValue=false;DOM:preventDefault();
        oEvent.preventDefault=function(){
            this.returnValue=false;//?能不能用oEvent 当然可以
        };
        //取消事件冒泡,IE:cancelBubble=true;DOM:stopPropagation()
        oEvent.stopPropagation=function(){
            this.cancelBubble=true;
        };
        //引起事件的元素，IE:srcElement;DOM:target
        oEvent.target=oEvent.srcElement;
        //事件的第二目标，IE：fromElement(鼠标所要离开的元素)-toElement(鼠标所要移入的元素)
        //DOM：relatedTarget
        if(oEvent.type=='onmouseover'){
            oEvent.relatedTarget=oEvent.fromElement;
        }else if(oEvent.type=='onmouseout'){
            oEvent.relatedTarget=oEvent.toElement;
        }
        //事件发生的时间，IE：no，DOM:timestamp(时间戳)
        oEvent.timeStamp=(new Date().getTime());
    }
    return oEvent;

}

4-获取事件对象

在IE中，事件对象时window对象的一个属性event

在DOM标准中，event对象必须作为唯一的参数传递给事件处理函数

关于caller的具体用法请参考click here

Eventutil.getEvent=function(){
    if(window.event){
        return this.formatEvent(window.event);
    }else{
        //caller-每一个函数都有的属性，它包含了指向了调用它的方法的引用
        return Eventutil.getEvent.caller.arguments[0];
    }
}

5-使用方法

DEMO-阻止右键菜单JavaScript代码（HTML省略，请读者自行加上）

var oDiv=document.getElementById('demo');
document.oncontextmenu=function(){
    var e=Eventutil.getEvent();
    e.preventDefault();
}

最后的话：

关于eventPhase的用法我也没有深入研究，下次添上。莫怪！

关于isChar的用法，如果调用e.isChar(),Chrome返回undefined,FF返回false，IE返回true，这个问题，我也没解决

关于timeStamp，中文译书上面是timeStamp中的s是小写，估计是印刷错误

如有错误或者不妥还请斧正！