當前位置:
首頁 >
前端技术
> javascript
>内容正文
javascript
原生JS实现跨浏览器的事件处理程序
生活随笔
收集整理的這篇文章主要介紹了
原生JS实现跨浏览器的事件处理程序
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
<!doctype html>
<html lang="en">
<head><meta charset="UTF-8"><title>跨瀏覽器的事件處理程序</title>
</head>
<body><input type="button" value="click me" id="myBtn"/><input type="button" value="解除" id="unlisten"/><script>function $(id){return document.getElementById(id);}var EventUtil={fnCount:0,fnData:{},addHandler:function(element,type,handler){this.fnCount++;handler.fid = this.fnCount;var _fn = handler;handler = function(){_fn.call(element);};this.fnData[this.fnCount] = handler;if(element.addEventListener){element.addEventListener(type,handler,false);} else if(element.attachEvent){element.attachEvent("on"+type,handler);} else {element["on"+type]=handler;}},removeHandler:function(element,type,handler){handler = this.fnData[handler.fid];if(element.removeEventListener){element.removeEventListener(type,handler,false);}else if(element.detachEvent){element.detachEvent("on"+type,handler);}else{element["on"+type]=null;}}}var btn=$("myBtn");var unbtn = $('unlisten');var bindFn1=function(){alert(this.id);};var bindFn2=function(){alert('2');};EventUtil.addHandler(btn,"click",bindFn1);EventUtil.addHandler(btn,"click",bindFn2);//EventUtil.removeHandler(btn,"click",bindFn1);EventUtil.addHandler(unbtn,"click",function(){EventUtil.removeHandler(btn,"click",bindFn1);});</script>
</body>
</html>
《新程序員》:云原生和全面數字化實踐50位技術專家共同創作,文字、視頻、音頻交互閱讀
《新程序員》:云原生和全面數字化實踐50位技術專家共同創作,文字、視頻、音頻交互閱讀
總結
以上是生活随笔為你收集整理的原生JS实现跨浏览器的事件处理程序的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: JavaScript try/catch
- 下一篇: JS的Event属性和方法