事件绑定兼容函数
来源《JavaScript高级程序设计》
代码如下：
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title></title> 5 <style type="text/css"> 6 7 </style> 8 <script type="text/javascript"> 9 var EventUtil = { 10 addHandler:function(element,type,handler){//绑定事件 11 if(element.addEventListener){//现代浏览器，作用域是在其所属元素的作用域内 12 element.addEventListener(type,handler,false); 13 } 14 else if(element.attachEvent){//IE8及其以下，作用域是全局作用域 15 element.attachEvent("on"+type,handler); 16 } 17 else{//DOM2级方法，作用域在其所属的元素的作用域内 18 element["on"+type] = handler; 19 } 20 }, 21 getEvent:function(event){//获取event对象 22 return event ? event : window.event; 23 }, 24 getTarget:function(event){//获取目标元素 25 return event.target || event.srcElement; 26 }, 27 preventDefault:function(event){//取消默认行为 28 if(event.preventDefault){ 29 event.preventDefault(); 30 } 31 else{ 32 event.returnValue = false; 33 } 34 }, 35 removeHandler:function(element,type,handler){//解除事件绑定 36 if(element.removeEventListener){ 37 element.removeEventListener(type,handler,false); 38 } 39 else if(element.detachEvent){ 40 element.detachEvent("on"+type,handler); 41 } 42 else{ 43 element["on"+type] = null; 44 } 45 }, 46 stopPropagation:function(event){ 47 if(event.stopPropagation){ 48 event.stopPropagation(); 49 } 50 else{ 51 event.cancelBubble = true; 52 } 53 } 54 }; 55 function handler(){ 56 alert(this); 57 } 58 window.onload = function(){//使用例子 59 var btn = document.getElementById("btn"); 60 //EventUtil.addHandler(btn,"click",handler); 61 btn.onclick = function(event){ 62 var event = EventUtil.getEvent(event); 63 console.log(event); 64 } 65 } 66 </script> 67 </head> 68 <body> 69 <input type="button" value="点击" id="btn"> 70 </body> 71 </html>
