跨浏览器之事件对象

所以浏览器都支持事件对象，但是支持的方式不同。用的比较多的属性就是：

（1）阻止冒泡事件。

（2）阻止默认事件。

（3）get事件的目标。

1.DOM中的事件对象

在DOM中，无论是在DOM0级还是DOM2级中，也不论什么方法，都会传入一个event对象。

在DOM中，阻止冒泡事件用的是event下的stopPropagation（）方法。阻止默认事件用的是preventDefault（）。get事件的目标是用的event下的target属性。

2.IE中的事件对象

在IE中事件对象是在window下的，用window.event来使用。

阻止冒泡事件用的是cancelBubble属性来控制，默认为false，设置为true可以阻止冒泡事件。阻止默认事件用的是returnValue，默认为true，设置为false可以阻止。get事件的目标是用的window.event下的srcElement属性。

综合以上，可以整合出跨浏览器使用事件对象的函数：

 1 var eventMethod = {
 2      getEvent : function(event){//get事件对象
 3                     return event ? event : window.event;
 4                 }
 5      getTarget : function(event){//get事件的目标
 6                     return event.target ? event.target : window.event.srcElement;
 7                 }
 8      preventDefault : function(event){//阻止默认事件
 9                         if(event.preventDefault){
10                             event.preventDefault();
11                         }else{
12                             window.event.returnValue = false;
13                         }
14                     }
15      stopPropagetion : function(event){//停止冒泡事件
16                         if(event.stopPropagation){
17                             event.stopPropagation();
18                         }else{
19                             window.event.cancelBubble = true;
20                         }
21                     }
22 }

通过以上对象，就可以在每个浏览器中放心大胆的使用事件的对象了：

1 oA.onclick = function(event){
2     eventMethod.getEvent(event);
3 }

 

转载于:https://www.cnblogs.com/178-533/p/7535367.html