zoukankan      html  css  js  c++  java
  • 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
    	});
    });
    

      

     

  • 相关阅读:
    POJ 3680_Intervals
    POJ 3680_Intervals
    POJ 3686_The Windy's
    POJ 3686_The Windy's
    Codeforces 629C Famil Door and Brackets
    Codeforces 629D Babaei and Birthday Cake(树状数组优化dp)
    Codeforces 629D Babaei and Birthday Cake(线段树优化dp)
    Codeforces 628F Bear and Fair Set
    18.04.26 魔兽世界终极版
    18.4.20 STL专项练习8选6
  • 原文地址:https://www.cnblogs.com/yangliulang/p/3186404.html
Copyright © 2011-2022 走看看