跨浏览器的事件对象

在前端开发工作中,由于浏览器兼容性等问题,触发事件对象的方法不同,分为IE和非IE两种。下面主要介绍跨浏览器触发 目标事件阻止事件的默认行为阻止事件冒泡 三种方法:

跨浏览器的事件对象
var EventUtil = {
        target : function(e){    //目标事件
            e = e || window.event;
            return  e.target || e.srcElement;
        },
        preventDefault : function(e){    //阻止事件的默认行为
            e = e || window.event;
            if(e.preventDefault){
                e.preventDefault();
            }else{
                e.returnValue = false;
            }
        },
        stopPropagation : function(e){    //阻止事件冒泡
            e = e || window.event;
            if(e.stopPropagation){
                e.stopPropagation();
            }else{
                e.cancelBubble = true;
            }
        },

      charCode : function(e){ //取得字符编码
e = e || window.event;
return e.keyCode || e.charCode;
}

    };
跨浏览器的事件对象

以上代码,我们为EventUtil添加了3个方法,我们可以像下面这样使用这些方法:

跨浏览器的事件对象
var div=document.getElementById('div');
div.onclick
= function(e){
var target = EventUtil.target(e); alert(target.tagName); }

  document.onkeydown=function(e){
var code=EventUtil.charCode(e);
console.log(code); //按键盘上的键 看效果
}

 
跨浏览器的事件对象

 本文转自挨踢前端博客园博客,原文链接http://www.cnblogs.com/duanhuajian/archive/2013/03/15/2961199.html如需转载请自行联系原作者


@挨踢前端

上一篇:EventSelect套接字链表对象和线程链表对象组合下的事件Select模型


下一篇:event事件对象