搜索:
首页 >> JavaScript >> Js高级编程 >> js增强的自定义事件模型

js增强的自定义事件模型

2008-2-18 作者:月影 来源:影月阁 投递文章

原型:EventManager是一个重要的原型,它用来赋予对象自定义事件的能力

当对象类型的原型继承EventManager时,对象具有定义、分派和捕捉事件的能力

EventManager有四个重要的方法dispatchEvent、captureEvent、addEventListener和removeEventListener

function EventManager()
{
    this.dispatchEvent = function(eventType, eventArgs)
     {
        eventArgs = eventArgs || {};
         var events = this["on"+eventType];
         var called = 0;
         if(events && typeof(events) == "function")
            events = [events];
         if(!eventArgs.type) eventArgs.type = eventType;
        //阻止默认动作的执行
        eventArgs.preventDefault = function()
         {
            eventArgs.defaultOp = null;
         }
        //阻止事件起泡
        eventArgs.stopPropagation = function()
         {
            eventArgs.cancelBubble = true;
         }
         var $pointer = this;
         if(events)
         {
             for(var i = 0; i < events.length; i++)
             {
                setTimeout(
                     (function(i){
                         var evt = events[i];
                         var len = events.length;
                         var capturer = events.capturer;
                         var capturerName = events.capturerName;
                         return     function(){
                            called++;
                             var ret = evt.call($pointer,eventArgs);
                            //如果有捕获事件的方法,并且没有阻止事件气泡,在最后一个事件处理程序结束之后调用它
                            if(!eventArgs.cancelBubble && called == len && capturer && capturerName && capturer[capturerName])
                             {
                                setTimeout(function(){
                                        capturer[capturerName](eventArgs)
                                     },1)
                             }
                            //如果定义了默认动作,在最后一个事件处理程序结束之后执行它
                            if(called == len && eventArgs.defaultOp) 
                             {
                                eventArgs.defaultOp.call($pointer, eventArgs);
                             }
                             return ret;
                         }
                     })(i), 1
                );
             }
         }
         else if(eventArgs.defaultOp)
         {
            eventArgs.defaultOp.call($pointer, eventArgs);
         }
     }
    this.fireEvent = this.dispatchEvent;
    this.captureEvents = function(target, eventType, capturerName, closure)
     {
         if(capturerName instanceof Function)
         {
            closure = capturerName;
            capturerName = null;
         }
        capturerName = capturerName || "on" + eventType;
        target["on"+eventType] = target["on"+eventType] || [function(){}];
         var events = target["on"+eventType];
         if(typeof(events) == "function")
         {
            target["on"+eventType] = [events];
         }
        target["on"+eventType].capturer = this;
        target["on"+eventType].capturerName = capturerName;
         if(closure)
            this[capturerName] = closure;
     }
    this.addEventListener = function(eventType, closure)
     {
         if(this["on"+eventType] == null)
         {
            this["on"+eventType] = [];
         }
         var events = this["on"+eventType];
         if(events && typeof(events) == "function"){
            this["on"+eventType] = [events];        
            events = this["on"+eventType];
         }
        events.push(closure);
         return closure;
     }
    this.removeEventListener = function(eventType, closure)
     {
         var events = this["on"+eventType];
         if(events && typeof(events) == "function")
            events = [events];        
        
         for(var i = 0; i < events.length; i++)
         {
             if(events[i] == closure)
                events.splice(i, 1);
         }
         return closure;
     }

Tags:自定义  事件  js 
相关文章
手机版 Js高级编程 Asp之家 Aspxhome.com
闽ICP备06017341号