javascrit事件绑定,删除方法(解决IE现代事件绑定方法的一些缺陷).

/**
@跨浏览器事件绑定,删除方法
@解决IE现代事件绑定几个问题
@1,重复绑定同一个处理函数不能过滤
@2,处理函数的执行顺序问题
@3,处理函数内this的指向问题
@4,事件对象的不统一问题(添加了常用的W3C事件对象)
@添加方法:addEvent(obj,type,fn);
@删除方法:removeEvent(obj,type,fn);
@name:杨永,qq:377746756,call:18911082352
*/
function addEvent(obj,type,fn){
	//w3c
	if(obj.addEventListener){
		obj.addEventListener(type,fn,false);
	}else{
		//如果IE就创建一个存放事件的哈希表
		if(!obj.events){
			obj.events={};
		};
		//如果事件类型的哈希表不存在处理函数,创建一个存放处理函数的数组
		if(!obj.events[type]){
			obj.events[type]=[];
		};
		//如果此对象不存在对应事件类型的处理函数,就默认放置到第一个位置
		if(!obj["on"+type]){
			obj.events[type][0]=fn;
		}else{;
			//如果重复添加同一个处理函数,就过滤
			if(addEvent.exec(obj.events[type],fn)){return false};
			//如果存在就依次添加计数器来保存所以后续的处理函数
			obj.events[type][addEvent._id_++]=fn;
		};
		//最后执行所有事件处理函数
		obj["on"+type]=function(){
			for(var i in obj.events[type]){
				//对象冒充解决this和传递事件对象
				obj.events[type][i].call(obj,addEvent.fixEvt(event));
			};
		};
	};
};
//用来添加事件时记录处理函数的id
addEvent._id_=1;
addEvent.exec=function(events,fn){
	for(var i in events){
		if(events[i]==fn){return true};
	};
	return false;
};
//标准化事件对象
addEvent.fixEvt=function(evt){
	if(!evt.preventDefault){
		//取消事件默认行为
		evt.preventDefault=function(){
			evt.returnValue=false;
		};
		//取消事件冒泡
		evt.stopPropagation=function(){
			evt.cancelBubble=true;
		};
		evt.layerX=evt.offsetX+evt.srcElement.clientLeft;
		evt.layerY=evt.offsetY+evt.srcElement.clientTop;
		evt.target=evt.srcElement;
		if(evt.type=="mouseover"){
			evt.relatedTarget=evt.fromElement;
		}else if(evt.type=="mouseout"){
			evt.relatedTarget=evt.toElement;
		};
		evt.pageX=document.documentElement.scrollLeft+evt.clientX;
		evt.pageY=document.documentElement.scrollTop+evt.clientY;
	};
	return evt;
};
//删除事件
function removeEvent(obj,type,fn){
	//w3c
	if(obj.removeEventListener){
		obj.removeEventListener(type,fn);
	}else{
		//ie
		for(var i in obj.events[type]){
			if(obj.events[type][i]==fn){
				obj.events[type].splice(i,1);
			};
		};
	};
};

 使用方式:

addEvent(window,"load",function(){
	var oDiv=document.getElementById("oDiv");
	addEvent(oDiv,"click",function(e){
		alert(e);  		//弹出事件对象
		alert(this);		//弹出oDiv
	});
});

  

 

原文地址:https://www.cnblogs.com/yangliulang/p/3186404.html