首页 > 代码库 > 原生js绑定和解绑事件,兼容IE,FF,chrome
原生js绑定和解绑事件,兼容IE,FF,chrome
主要是最近项目中用到了原生的js 解绑和绑定 事件 然后今天研究了一下,其实问题不大,不过要注意不要把单词写错了,今天我就找了好久单词写错了。
需求:当鼠标移上去以后,给Select加载元素,接着解除这个事件。贴上代码,这个是可以运行的,兼容 IE FF chrome
1 <html> 2 <head> 3 <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> 4 <title>js绑定和解绑事件</title> 5 </head> 6 <body> 7 选择 8 <select id="sel1"> 9 <option>--请选择--</option>10 </select>11 12 <br/>13 <br/>14 <br/>15 <br/>16 <br/>17 <br/>18 <br/>19 <br/>20 选择221 <select id="sel2">22 <option>--请选择--</option>23 </select>24 25 26 27 28 <script type="text/javascript">29 30 var _obj = {};31 32 // 事件绑定33 _obj.bindHandler = (function() {34 return function(obj,type,fn){35 var func = function(){36 fn.call(obj); //这里主要是想将obj这个哥们传到我们后期要调用的函数中,所以可以将参数绑定在这个哥们身上37 };38 obj.fnn = func; //这里主要是为了在解绑的时候取到函数名39 obj.addEventListener ? obj.addEventListener(type,func,false) : obj.attachEvent("on"+type,func); 40 }41 })();42 43 // 事件解除 44 _obj.removeHandler = (function() {45 return function(obj,type,fn){ 46 obj.removeEventListener ? obj.removeEventListener(type,fn,false) : obj.detachEvent("on"+type,fn); 47 }48 })();49 50 51 _obj.selEvent=function(){52 var id = this.id;53 //添加option54 for(var j=0;j<5;j++){55 this.options[this.length]=new Option("tl"+j,"值"+j);56 }57 58 //解除绑定59 _obj.removeHandler(this,‘mouseover‘,this.fnn);60 61 //如果 id = sel162 if("sel1"==id){ 63 //移除sel2的绑定64 var sel2 = document.getElementById(‘sel2‘);65 _obj.removeHandler(sel2,‘mouseover‘,sel2.fnn);66 }67 }68 69 _obj.init=function(){70 //绑定事件71 var sels = document.getElementsByTagName("select");72 for(var i=0;i<sels.length;i++){73 _obj.bindHandler(sels[i],‘mouseover‘,_obj.selEvent);74 }75 }76 77 _obj.init();78 79 80 </script>81 82 </body>83 </html>
原生js绑定和解绑事件,兼容IE,FF,chrome
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。