关于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 相关文章推荐
Node.js生成HttpStatusCode辅助类发布到npm
Apr 09 Javascript
setInterval()和setTimeout()的用法和区别示例介绍
Nov 17 Javascript
JavaScript利用构造函数和原型的方式模拟C#类的功能
Mar 06 Javascript
处理文本部分内容的TextRange对象应用实例
Jul 29 Javascript
node.js中的fs.linkSync方法使用说明
Dec 15 Javascript
jquery实现可拖拽弹出层特效
Jan 04 Javascript
jQuery中unwrap()方法用法实例
Jan 16 Javascript
JavaScript中用sort()方法对数组元素进行排序的操作
Jun 09 Javascript
vue.js 1.x与2.0中js实时监听input值的变化
Mar 15 Javascript
如何给ss bash 写一个 WEB 端查看流量的页面
Mar 23 Javascript
VUE element-ui 写个复用Table组件的示例代码
Nov 18 Javascript
LayUI数据接口返回实体封装的例子
Sep 12 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中iconv函数使用方法
2008/05/24 PHP
ThinkPHP控制器里javascript代码不能执行的解决方法
2014/11/22 PHP
THINKPHP项目开发中的日志记录实例分析
2014/12/01 PHP
PHP开发中AJAX技术的简单应用
2015/12/11 PHP
php基于环形链表解决约瑟夫环问题示例
2017/11/07 PHP
thinkPHP框架实现生成条形码的方法示例
2018/06/06 PHP
jquery表格内容筛选实现思路及代码
2013/04/16 Javascript
javascript实现表单提交后,提交按钮不可用的方法
2015/04/18 Javascript
JS实现合并两个数组并去除重复项只留一个的方法
2015/12/17 Javascript
快速掌握Node.js环境的安装与运行方法
2016/02/16 Javascript
ES6新特性之Object的变化分析
2017/03/31 Javascript
Express URL跳转(重定向)的实现方法
2017/04/07 Javascript
详解如何优雅地在React项目中使用Redux
2017/12/28 Javascript
基于Node.js实现压缩和解压缩的方法
2018/02/13 Javascript
vue 路由页面之间实现用手指进行滑动的方法
2018/02/23 Javascript
Node.js中DNS模块学习总结
2018/02/28 Javascript
Vue使用mixins实现压缩图片代码
2018/03/14 Javascript
vue通过数据过滤实现表格合并
2020/11/30 Javascript
VUE+elementui面包屑实现动态路由详解
2019/11/04 Javascript
jQuery操作动画完整实例分析
2020/01/10 jQuery
JS实现可以用键盘方向键控制的动画
2020/12/11 Javascript
Python实现将罗马数字转换成普通阿拉伯数字的方法
2017/04/19 Python
python实现求最长回文子串长度
2018/01/22 Python
Python实现求解一元二次方程的方法示例
2018/06/20 Python
解决pandas .to_excel不覆盖已有sheet的问题
2018/12/10 Python
Pytest mark使用实例及原理解析
2020/02/22 Python
Python tornado上传文件的功能
2020/03/26 Python
python的setattr函数实例用法
2020/12/16 Python
python 列表推导和生成器表达式的使用
2021/02/01 Python
Pure Collection美国官网:来自英国羊绒专家的奢华羊绒
2017/11/19 全球购物
eVitamins日本:在线购买折扣维生素、补品和草药
2019/04/04 全球购物
2014年道德讲堂实施方案
2014/03/05 职场文书
销售主管竞聘书
2014/03/31 职场文书
大学生标准自荐书
2014/06/15 职场文书
党的群众路线教育实践活动领导班子对照检查材料
2014/09/25 职场文书
Golang bufio详细讲解
2022/04/21 Golang