码迷,mamicode.com
首页 > 编程语言 > 详细

javascript中自定义事件

时间:2015-02-03 12:36:18      阅读:172      评论:0      收藏:0      [点我收藏+]

标签:

自定义事件:用户可以指定事件类型,这个类型实际上就是一个字符串,然后为这个类型的事件指定事件处理函数,可以注册多个事件处理函数(用数组管理),调用时,从多个事件处理函数中找到再调用。

function EventTarget(){
            this.handlers={};
        }

        EventTarget.prototype={
            constructor:EventTarget,
            addHandler:function(type,handler){
                if(typeof this.handlers[type]==‘undefined‘){
                    this.handlers[type]=new Array();
                }
                this.handlers[type].push(handler);
            },
            removeHandler:function(type,handler){
                if(this.handlers[type] instanceof Array){
                    var handlers=this.handlers[type];
                    for(var i=0,len=handlers.length;i<len;i++){
                        if(handler[i]==handler){
                            handlers.splice(i,1);
                            break;
                        }
                    }
                }
            },
            trigger:function(event){
                if(!event.target){
                    event.target=this;
                }
                if(this.handlers[event.type] instanceof Array){
                    var handlers=this.handlers[event.type];
                    for(var i=0,len=handlers.length;i<len;i++){
                        handlers[i](event);
                    }
                }
            }
        }

 

 

addHandler方法用于添加事件处理程序,removeHandler方法用于移除事件处理程序,所有的事件处理程序在属性handlers中统一存储管理。调用trigger方法触发一个事件,该方法接收一个至少包含type属性的对象作为参数,触发的时候会查找handlers属性中对应type的事件处理程序。写段代码测试一下。

 

function onClose(event){
            alert(‘message:‘+event.message);
        }

        var target=new EventTarget();
        target.addHandler(‘close‘,onClose);

        //浏览器不能帮我们创建事件对象了,自己创建一个,自定义事件对象的属性
        var event={
            type:‘close‘,
            message:‘Page Cover closed!‘
        };

        target.trigger(event);

 

 



javascript中自定义事件

标签:

原文地址:http://www.cnblogs.com/lydialee/p/4269379.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!