当前位置: 首页 > Web前端 > JavaScript

js封装html事件,绑定通用类

时间:2023-03-27 17:46:36 JavaScript

因为浏览器中有些品牌和机型有特殊存在,有些方法不支持,这种事情很麻烦。比如在测试的时候,在谷歌浏览器中运行良好,但在IE中就不行了。你可以在caniuse网站上找到该api。AddEventListener在IE6-8中不支持stopPropagation,在IE6-8中也不支持。支持preventDefault一些浏览器支持仍然有疑问。在这种情况下,需要封装一个通用类和公共方法来支持此类事件。addEventListener和removeEventListener需要单独封装成一个类,实现比较简单。就是判断元素是否有method,存在就挂载。元素;}addEvent(type,handle){if(this.element.addEventListener){//事件类型,要执行的函数,是否捕获this.element.addEventListener(type,handle,false);}elseif(this.element.attachEvent){this.element.attachEvent("on"+type,function(){handle.call(element);});}else{this.element["on"+type]=handle;}}removeEvent(type,handle){if(this.element.removeEventListener){这个。元素。removeEventListener(类型,句柄,假);}elseif(this.element.detachEvent){这个。元素。detachEvent("on"+type,handle);}else{this.element["on"+type]=null;}}}//防止事件(主要是事件冒泡,因为IE不支持事件捕获)functionstopPropagation(event){if(event.stopPropagation){event.stopPropagation();//标准w3c}else{event.cancelBubble=true;//IE}}//取消事件的默认行为functionpreventDefault(event){if(event.preventDefault){event.preventDefault();//标准w3c}else{事件。返回值=假;//IE}}