javascrit事件绑定,删除方法(解决IE现代事件绑定方法的一些缺陷).
2013-07-12 15:28
525 查看
/** @跨浏览器事件绑定,删除方法 @解决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 }); });
相关文章推荐
- ASP.NET AJAX Advance Tips & Tricks (1) CascadingDropDown在IE和Safari中的一个缺陷和解决方法
- IE的option标签单击事件无法触发的解决方法
- jQuery 重复绑定事件的解决方法
- <img/>标签onerror事件在IE下的bug和解决方法
- Jquery动态添加节点,绑定事件失效的解决方法
- jQuery防止重复绑定事件的解决方法
- 【IE信息栏问题】本地html文件js被IE阻止的一些解决方法
- 解决给dom元素绑定click等事件无效问题的方法
- 【IE信息栏问题】本地html文件js被IE阻止的一些解决方法
- Butterknife 绑定控件后,点击事件判断为空,问题解决方法一
- Javascript JQuery 图片预加载load事件IE不兼容的问题的解决方法
- jQuery 事件绑定方法(bind hover toggle live.... )、删除事件方法(unbind, die)及 事件对象
- IE图标删除不了、快捷方式打不开解决方法
- <img/>标签onerror事件在IE下的bug和解决方法
- 手机端给父元素绑定了长按事件,但是子元素的点击事件不被触发的解决方法——事件委托
- jQuery中的bind绑定事件与文本框改变事件的临时解决方法
- jQuery防止重复绑定事件的解决方法
- 解决给dom元素绑定click等事件无效问题的方法
- DataGridView绑定List时无法进行添加删除操作的解决方法
- 在IE 6中<a>标签的一些bug和解决方法