跨浏览器的事件对象
var EventUtil = { addHandler: function(element,type,handler){//添加事件 if (element.addEventListener) { element.addEventListener(type,handler,false); }else if (element.attachEvent) { element.attachEvent('on'+type,handler); }else { element['on'+type] = handler; } }, getEvent: function(event){//获得事件对象 return event || window.event; }, getTarget: function(event){//获得事件元素 return event.target || event.srcElement; }, preventDefault: function(){//取消默认事件行为 if (event.preventDefault) { event.preventDefault(); }else { event.returnValue = false; } }, removeHandler: function(element,type,handler){//取消事件 if (element.removeEventListener) { element.removeEventListener(type,handler,false) }else if (element.dettchEvent) { element.dettchEvent('on'+type,handler); }else { element['on'+type] = null; } }, stopPropagation: function(event){//取消冒泡机制 if (event.stopPropagation) { event.stopPropagation(); }else { event.cancleBubble = true; } }, getRelatedTarget: function(event){ if (event.relatedTarget) { return event.relatedTarget;//标准下返回相关元素 }else if (event.toElement) { return event.toElement;//mouseout事件触发,保存相关元素 }else if (event.fromElement) { return event.fromElement;//mouseover事件触发,保存相关元素 } }, getButton: function(event){//鼠标按钮兼容 if (document.implementation.hasFeature('MouseEvents','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; } } }, getWheelDelta: function(event){//滚轮事件兼容 //所以要兼容,写两个函数函数 //client的兼容性必须先写出来 if (event.wheelDelta) { /* 兼容opear9.5以前版本的正负相反,mousewheel */ return (window.client.engine.opera && window.client.engine.opera < 9.5 ? -event.wheelDelta : event.wheelDelta); }else { /* 兼容firefox正负和3的倍数的问题,DOMMouseScroll */ return -event.detail*40; } }, getCharCode: function(event){//键盘事件兼容 if (typeof event.charCode == 'number')//首先检测按键有没有代表的字符,如果没有就没有charCode,为undefined { return event.charCode; }else { return event.keyCode } } }
首先要用EventUtil.getEvent(event);获得统一的event对象