关于js注册事件的常用方法


Posted in Javascript onApril 03, 2013

不解释,看代码:

;(function(){
    //进行库封装,防止对象污染
    window['cm']={};
/**
    *给对象注册事件
    */
    var addListener=function(element,type,fn){
        if(typeof element == 'undefined') return false;
        if(element.addEventListener){
            element.addEventListener(type,fn,false);
        }else if(element.attachEvent){
            //将事件缓冲到该标签上,已解决this指向window(现fn内this指向element)和移除匿名事件问题
            var _EventRef='_'+type+'EventRef';
            if(!element[_EventRef]){
                element[_EventRef]=[];
            }
            var _EventRefs=element[_EventRef];
            var index;
            for(index in _EventRefs){
                if(_EventRefs[index]['realFn']==fn){
                    return;
                }
            }
            var nestFn=function(){
                fn.apply(element,arguments);
            };
            element[_EventRef].push({'realFn':fn,'nestFn':nestFn});
            element.attachEvent('on'+type,nestFn);
        }else{
            element['on'+type]=fn;
        }
    };
    window['cm']['addListener']=addListener;
    /**
    *移除对象上已注册事件
    */
    var removeListener=function(element,type,fn){
        if(typeof element == 'undefined') return false;
        if(element.removeEventListener){
            element.removeEventListener(type,fn,false);
        }else if(element.detachEvent){
            var _EventRef='_'+type+'EventRef';
            if(!element[_EventRef]){
                element[_EventRef]=[];
            }
            var _EventRefs=element[_EventRef]
            var index;
            var nestFn;
            for(index in _EventRefs){
                if(_EventRefs[index]['realFn']==fn){
                    nestFn=_EventRefs[index]['nestFn'];
                    if(index==_EventRefs.length-1){
                        element[_EventRef]=_EventRefs.slice(0,index);
                    }else{
                        element[_EventRef]=_EventRefs.slice(0,index).concat(_EventRefs.slice(index+1,_EventRefs.length-1));
                    }
                    break;
                }
            }
            if(nestFn){
                element.detachEvent('on'+type,nestFn);
            }
        }else{
            element['on'+type]=null;
        }
    };
})();

 

Javascript 相关文章推荐
jquery实现带单选按钮的表格行选中时高亮显示
Aug 01 Javascript
js 获取时间间隔实现代码
May 12 Javascript
JS实现至少包含字母、大小写数字、字符的密码等级的两种方法
Feb 03 Javascript
JavaScript实现的简单拖拽效果
Jun 01 Javascript
常见的javascript跨域通信方法
Dec 31 Javascript
两种js监听滚轮事件的实现方法
May 13 Javascript
js中常用的Math方法总结
Jan 12 Javascript
vue router-link传参以及参数的使用实例
Nov 10 Javascript
webpack搭建vue 项目的步骤
Dec 27 Javascript
JavaScript遍历查找数组中最大值与最小值的方法示例
May 24 Javascript
Weex开发之WEEX-EROS开发踩坑(小结)
Oct 16 Javascript
Vue性能优化的方法
Jul 30 Javascript
JavaScript栏目列表隐藏/显示简单实现
Apr 03 #Javascript
JS模板实现方法
Apr 03 #Javascript
JS实现标签页效果(配合css)
Apr 03 #Javascript
JS实现下拉框的动态添加(附效果)
Apr 03 #Javascript
js去字符串前后空格5种实现方法及比较
Apr 03 #Javascript
终于解决了IE8不支持数组的indexOf方法
Apr 03 #Javascript
jQuery布局插件UI Layout简介及使用方法
Apr 03 #Javascript
You might like
php基础知识:函数基础知识
2006/12/13 PHP
php Http_Template_IT类库进行模板替换
2009/03/19 PHP
输入值/表单提交参数过滤有效防止sql注入的方法
2013/12/25 PHP
Php中使用Select 查询语句的实例
2014/02/19 PHP
PHP获取数组中重复最多的元素的实现方法
2014/11/11 PHP
PHP中if和or运行效率对比
2014/12/12 PHP
PHP实现的Redis多库选择功能单例类
2017/07/27 PHP
FF IE浏览器修改标签透明度的方法
2014/01/27 Javascript
使用jQuery获取data-的自定义属性
2015/11/10 Javascript
JavaScript实现经纬度转换成地址功能
2017/03/28 Javascript
微信小程序获取手机号授权用户登录功能
2017/11/09 Javascript
图文介绍Vue父组件向子组件传值
2018/02/17 Javascript
React styled-components设置组件属性的方法
2018/08/07 Javascript
JavaScript设计模式之装饰者模式实例详解
2019/01/17 Javascript
微信小程序本地存储实现每日签到、连续签到功能
2019/10/09 Javascript
js实现GIF图片的分解和合成
2019/10/24 Javascript
jQuery表单校验插件validator使用方法详解
2020/02/18 jQuery
[05:37]DOTA2-DPC中国联赛 正赛 Elephant vs iG 选手采访
2021/03/11 DOTA
wxpython 最小化到托盘与欢迎图片的实现方法
2014/06/09 Python
Python保存MongoDB上的文件到本地的方法
2016/03/16 Python
TF-IDF算法解析与Python实现方法详解
2017/11/16 Python
Python中单例模式总结
2018/02/20 Python
python实现反转部分单向链表
2018/09/27 Python
浅谈python连续赋值可能引发的错误
2018/11/10 Python
Python3 使用cookiejar管理cookie的方法
2018/12/28 Python
详解python中的index函数用法
2019/08/06 Python
python tkinter组件摆放方式详解
2019/09/16 Python
查看keras各种网络结构各层的名字方式
2020/06/11 Python
python中用Scrapy实现定时爬虫的实例讲解
2021/01/18 Python
详解android与HTML混合开发总结
2018/06/06 HTML / CSS
委托公证书样本
2015/01/23 职场文书
老公写给老婆的检讨书
2015/05/06 职场文书
工程项目合作意向书
2015/05/08 职场文书
义卖募捐活动总结
2015/05/09 职场文书
Windows server 2012 配置Telnet以及用法详解
2022/04/28 Servers
MySQL安装失败的原因及解决步骤
2022/06/14 MySQL