纯JavaScript实现的兼容各浏览器的添加和移除事件封装


Posted in Javascript onMarch 28, 2015
//事件处理兼容各种浏览器,采用能力检测方法,所谓能力检测,就是有能力就做,没有能力就不做
 
 //定义一个处理事件的对象,兼容各种浏览器,dom2级事件处理和ie事件,如果这两个事件都不兼容,就采用dom0级处理
 var eventUtil ={
    addEvent:function(element,type,handler){
      if (element.addEventListener) {
      	//非IE浏览器采用dom2级事件处理,type为事件类型如:click,handler为事件处理函数,false代表事件采用冒泡处理模型,如果是true代表 采用捕获型处理模型
      	//除了netbeans采用捕获型处理模型,其他都采用冒泡型处理模型
      	//如果是非IE浏览器添加事件为:addEventListener
      	element.addEventListener(type,handler,false);
      }else if (element.attachEvent) {
      	//如果为IE浏览器,添加事件采用 attachEvent
      	element.attachEvent('on'+type,handler);
      }else{
        element['on'+type] = handler;
      }
    },
    removeEvent:function(element,type,handler){
      if (element.removeEventListener) {
      	//非IE浏览器采用dom2级事件处理,type为事件类型如:click,handler为事件处理函数,false代表事件采用冒泡处理模型,如果是true代表 采用捕获型处理模型
      	//除了netbeans采用捕获型处理模型,其他都采用冒泡型处理模型
      	//如果是非IE浏览器添加事件为:removeEventListener
      	element.removeEventListener(type,handler,false);
      }else if (element.detachEvent) {
      	//如果为IE浏览器,添加事件采用 detachEvent
      	element.detachEvent('on'+type,handler);
      }else{
      	//dom0级事件处理,如果删除事件采用赋值null
        element['on'+type] = null;
      }
    },
    getEvent:function(event){
    	  //获取事件本身
    	 return event?event:window.event;
    },
    getType:function(event){
    	 //获取事件类型
    	 return event.type;
    },
    getElement:function(event){
    	 //获取事件作用元素
    	 return event.target || event.srcElement;
    },
    preventDefault:function(event){
    	  //阻止默认的事件行为
      if(event.preventDefault){
      	  event.preventDefault();
      }else{
      	  event.returnValue = false;
      }
    },
    stopProPagation:function(event){
    	//停止事件冒泡
    	  if(event.stopProPagation){
        event.stopProPagation();
    	  }else{
    	  	  event.cancelBubble = true;
    	  }
    }




 }
Javascript 相关文章推荐
JS中简单的实现像C#中using功能(有源码下载)
Jan 09 Javascript
超级简单的图片防盗(HTML),好用
Apr 08 Javascript
解决js中window.open弹出的是上次的缓存页面问题
Dec 29 Javascript
jQuery判断checkbox(复选框)是否被选中以及全选、反选实现代码
Feb 21 Javascript
JavaScript中匿名函数用法实例
Mar 23 Javascript
javascript的replace方法结合正则使用实例总结
Jun 16 Javascript
jQuery Ajax 上传文件处理方式介绍(推荐)
Jun 30 Javascript
javascirpt实现2个iframe之间传值的方法
Jun 30 Javascript
浅析vue数据绑定
Jan 17 Javascript
Express + Session 实现登录验证功能
Sep 08 Javascript
基于Angular中ng-controller父子级嵌套的相关属性详解
Oct 08 Javascript
node实现生成带参数的小程序二维码并保存到本地功能示例
Dec 05 Javascript
jquery表单验证插件(jquery.validate.js)的3种使用方式
Mar 28 #Javascript
JQuery调用绑定click事件的3种写法
Mar 28 #Javascript
对Web开发中前端框架与前端类库的一些思考
Mar 27 #Javascript
Javascript优化技巧之短路表达式详细介绍
Mar 27 #Javascript
学习JavaScript编程语言的8张思维导图分享
Mar 27 #Javascript
JavaScript中的函数声明和函数表达式区别浅析
Mar 27 #Javascript
jQuery使用fadein方法实现渐出效果实例
Mar 27 #Javascript
You might like
PHP 常用函数库和一些实用小技巧
2009/01/01 PHP
PHP写的求多项式导数的函数代码
2012/07/04 PHP
Windows下的PHP安装pear教程
2014/10/24 PHP
分享php分页的功能模块
2015/06/16 PHP
使用jquery为table动态添加行的实现代码
2011/03/30 Javascript
JavaScript在XHTML中的用法详解
2013/04/11 Javascript
多次注册事件会导致一个事件被触发多次的解决方法
2013/08/12 Javascript
在JavaScript中使用NaN值的方法
2015/06/05 Javascript
浅析jquery数组删除指定元素的方法:grep()
2016/05/19 Javascript
每日十条JavaScript经验技巧(一)
2016/06/23 Javascript
jQuery中fadein与fadeout方法用法示例
2016/09/16 Javascript
javascript prototype原型详解(比较基础)
2016/12/26 Javascript
ajax接收后台数据在html页面显示
2017/02/19 Javascript
js canvas实现擦除效果示例代码
2017/04/26 Javascript
JS实现可控制的进度条
2020/03/25 Javascript
python字典的常用操作方法小结
2016/05/16 Python
玩转python selenium鼠标键盘操作(ActionChains)
2020/04/12 Python
python学习笔记之列表(list)与元组(tuple)详解
2017/11/23 Python
Python 3.6 读取并操作文件内容的实例
2018/04/23 Python
python3实现字符串的全排列的方法(无重复字符)
2018/07/07 Python
Sanic框架蓝图用法实例分析
2018/07/17 Python
10 行 Python 代码教你自动发送短信(不想回复工作邮件妙招)
2018/10/11 Python
python 数据生成excel导出(xlwt,wlsxwrite)代码实例
2019/08/23 Python
Pycharm小白级简单使用教程
2020/01/08 Python
Python如何对XML 解析
2020/06/28 Python
html5自带表单验证体验优化及提示气泡修改功能
2017/09/12 HTML / CSS
HTML5 在canvas中绘制矩形附效果图
2014/06/23 HTML / CSS
在子网210.27.48.21/30种有多少个可用地址?分别是什么?
2014/07/27 面试题
初三政治教学反思
2014/01/30 职场文书
保护环境倡议书
2014/04/14 职场文书
2015年消费者权益日活动总结
2015/02/09 职场文书
三潭印月的导游词
2015/02/12 职场文书
关于环保的宣传稿
2015/07/23 职场文书
关于感恩老师的古诗句
2019/08/20 职场文书
浅谈golang 中time.After释放的问题
2021/05/05 Golang
MySQL连表查询分组去重的实现示例
2021/07/01 MySQL