addEventListener 和attachEvent 兼容性封装

addEventListener 和attachEvent 兼容性封装

addEventListener 和attachEvent 是DOM2级事件绑定的方法，但是IE只支持attachEvent ，并且在有同一个事件源执行多个事件名相同的方法时，会有this指向，顺序，重复的问题，下面函数是进行封装的，兼容所有的浏览器。var tempFn = null;function  bind(curEle,eventType,eventFn){if("addEventListener" in document){curEle.addEventListener(eventType,eventFn,false);return;}//解决this指向问题,并记录改变this前的eventFntempFn = function(){eventFn.call(curEle)}tempFn.photo = eventFn;//判断该自定义属性之前是否存在,不存在就创建，存储多个方法改变this指向后的结果if(!curEle['myBind'+eventType]){curEle['myBind'+eventType] = [];}//解决重复问题// 添加前，看一下之前是否已经有了，有了就不添加，也不往事件池中存储var ary = curEle['myBind'+eventType]for(var i = 0 ; i < ary.length; i++){if(ary[i].photo == eventFn){return;}}ary.push(tempFn);curEle.attachEvent("on"+eventType,tempFn);}function unbind(curEle,eventType,eventFn){if("removeEventListener" in document){curEle.removeEventListener(eventType,eventFn,false);return;}var ary = curEle['myBind'+eventType];for(var i = 0 ; i < ary.length; i++){if(ary[i].photo == eventFn){//找到后解除绑定curEle.detachEvent("on"+eventType,ary[i]);//移除自定义属性中对应的那一项arr.splice(i,1);break; }}}//解决顺序问题function on(curEle,eventType,eventFn){if(!curEle['myBind'+eventType]){curEle['myBind'+eventType] = [];}var ary = curEle['myBind'+eventType]for(var i = 0 ; i < ary.length ; i++){var cur = ary[i];if(cur == eventFn){return;}}ary.push(eventFn);bind(curEle,eventType,run)}function off(curEle,eventType,eventFn){var ary = curEle['myEvent' + eventType];for(var i = 0 ; i < ary.length; i++){var cur = ary[i];if(cur == eventFn){ary.splice(i,1)}}}function run(e){e = e || window.eventvar flag = e.target? true:false;if(!flag){e.target = e.srcElement;e,pageX = e.clientX +(document.documentElement.scrollLeft || document.body.scrollLeft)e,pageY = e.clientY +(document.documentElement.scrollTop || document.body.scrollTop)e.preventDefault = function(){e.returnValue = false}e.stopPropagation = function(){e.cancelBubble = true;}}//this ---->  e.targetvar ary = this['myEvent'+e.type];for(var i = 0 ; i < ary.lengthl i++){var tempFn = ary[i];tempFn.call(this,e);}}