跨浏览器之事件对象

因此浏览器都支持事件对象,可是支持的方式不一样。用的比较多的属性就是:浏览器

(1)阻止冒泡事件。函数

(2)阻止默认事件。spa

(3)get事件的目标。code

1.DOM中的事件对象对象

在DOM中,不管是在DOM0级仍是DOM2级中,也不论什么方法,都会传入一个event对象。blog

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

2.IE中的事件对象get

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

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

综合以上,能够整合出跨浏览器使用事件对象的函数:

 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 }
相关文章
相关标签/搜索