事件监听器的兼容性写法

it2022-05-08  10

事件监听器的兼容性写法

addEventListener不兼容IE8以下的浏览器,所以有了attachEvent的兼容性写法,二者兼容性写法如下: <button>赋诗</button> <script> var btn = document.getElementsByTagName("button")[0]; //事件监听的兼容写法 EventListener = { addEvent : function(ele,fn,str){ if(ele.addEventListener){ ele.addEventListener(str,fn); }else if(ele.attachEvent){ //兼容IE6、7、8 ele.attachEvent("on"+str,fn); }else{ ele["on"+str] = fn; } } } EventListener.addEvent(btn,fn1,"click"); EventListener.addEvent(btn,fn2,"click"); function fn1(){ console.log("九尺龙泉万卷书,上天生我意何如。"); } function fn2(){ console.log("不能报国平天下,枉为男儿大丈夫。"); } </script> 既然绑定监听事件有兼容性写法,那么解绑监听事件也需要一个兼容性写法。 <button>赋诗</button> <script> var btn = document.getElementsByTagName("button")[0]; //事件监听的兼容写法 EventListener = { addEvent : function(ele,fn,str){ if(ele.addEventListener){ ele.addEventListener(str,fn); }else if(ele.attachEvent){ //兼容IE6、7、8 ele.attachEvent("on"+str,fn); }else{ ele["on"+str] = fn; } }, removeEvent : function(ele,fn,str){ if(ele.removeEventListener){ ele.removeEventListener(str,fn); }else if(ele.detachEvent){ ele.detachEvent("on"+str,fn); }else{ ele["on"+str] = null; } } } EventListener.addEvent(btn,fn,"click"); EventListener.removeEvent(btn,fn,"click"); function fn(){ console.log("九尺龙泉万卷书,上天生我意何如。"); } </script>

最新回复(0)