封装 DOM事件 EventUtil对象 跨浏览器兼容
2017-03-23 11:21
302 查看
/* * eventUtil对象 封装了对DOM事件的 一些工具 完全兼容各种浏览器 */ var eventUtil={ // 添加句柄 addHandler:function(element,type,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){ if(element.removeEventListener){ element.removeEventListener(type,handler,false); }else if(element.detachEvent){ element.detachEvent('on'+type,handler); }else{ element['on'+type]=null; } }, //获取事件 getEvent:function(event){ return event?event:window.event; }, //获取事件类型 getType:function(event){ return event.type; }, //获取事件触发的DOM元素 getElement:function(event){ return event.target || event.srcElement; }, //阻止默认行为 例如a标签的href自动跳转功能 preventDefault:function(event){ if(event.preventDefault){ event.preventDefault(); }else{ event.returnValue=false; } }, //阻止事件冒泡 stopPropagation:function(event){ if(event.stopPropagation){ event.stopPropagation(); }else{ event.cancelBubble=true; } } }
相关文章推荐
- DOM事件处理跨浏览器(兼容IE)封装
- JS-DOM2级事件对象跨浏览器处理(已封装)
- JavaScript跨浏览器事件对象EventUtil(IE中event对象和方法DOM中都有,此处提供两者映射方法)
- 封装常用的跨浏览器的事件对象EventUtil
- JS--事件对象中部份浏览器不兼容方法
- 兼容浏览器的DOM对象自定义属性获取方法
- 浏览器事件对象兼容写法
- 关于浏览器兼容的问题以及字符串编码的一个坑,鼠标滚动事件mousewheel和DOMMouseScroll
- avascript计算器之DOM事件模型-----浏览器兼容问题
- js获取指定节点对象的样式属性的值的封装函数(兼容ie、Opera和符合w3c标准浏览器)
- JavaScript跨浏览器处理事件方法(封装成对象)
- 跨浏览器事件对象封装
- [js]如何在js方法中传递事件对象并且在各个浏览器之间兼容
- javascript之自定义js封装库兼容主流浏览器实现DOM加载之后,页面完全加载之前执行js
- DOM事件模型是如何的,编写一个EventUtil工具类实现事件管理兼容
- 把javascript event事件封装了下,兼容大多数浏览器
- DOM和IE跨浏览器的事件对象
- javascript计算器之DOM事件模型-----浏览器兼容问题
- 纯JavaScript实现的兼容各浏览器的添加和移除事件封装
- 跨浏览器事件对象及其封装自己的函数