常用的跨瀏覽器檢測方法
var EventUtil={ //跨瀏覽器處理常式---建立方法 addHandler:function(element,type,handler){ if(element.addEventListener){ element.addEventListneter(type,handler,false); }else if(element.attachEvent){ element.attachEvent("on"+type,handler); }else{ element["on"+type]=handler; } } removeHandler:function(element,type,handler){ //跨瀏覽器處理常式---刪除方法 if(element.removeEventListener){ element.removeEventListneter(type,handler,false); }else if(element.detachEvent){ element.detachEvent("on"+type,handler); }else{ element["on"+type]=handler; } } getEvent:function(event){ //跨瀏覽器事件對象---返回event對象的引用 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.canceBubble=false; } } getRelatedTarget:function(event){ //跨瀏覽器擷取相關元素 if(event.relatedTarget){ return event.relatedTarget; }else if(event.toElement){ return envent.toElement; }else if(event.fromElement){ return event.fromElement; }else{ return null; } } getButton:function(event){ //滑鼠事件的button屬性檢測 if(document.implementation.hasFeature("MouseEvent","2.0")){ return event.button; }else{ switch(event.button){ case 0: case 1: case 3: case 5: case 7: return 0; case 2: case 6: return 2 case 4: return 1 } } } getCharCode:function(event){ //跨瀏覽器字元編碼---charCode屬性檢測 if(typeof event,charCode=="number"){ return event.charCode; }else{ return event.keyCode; } }}
事件委託:事件處理常式過多的解決方案,減少記憶體並且提高效能;
類比事件:這個比較複雜,要慢慢研究;