| Blog信息 |
|
blog名称:
日志总数:1304
评论数量:2242
留言数量:5
访问次数:7589579
建立时间:2006年5月29日 |
| |
|
 [Prototype(Ajax)]js版事件管理器
软件技术
lhwork 发表于 2006/9/7 10:16:02 |
|
写的一个比较简单的事件管理器，主要从这些方面进行的考虑：1、实现事件的注册/反注册。2、实现事件的调用。3、注册事件的拦截器(方法执行前或执行后)。目前写的这个版本还比较简单，后一步需要增加事件的有效范围以及事件的拦截器的有效范围的支持，就是scope的概念，还有一个需要改进的地方是将目前事件调用的部分改为COR模式。源码如下：
500)this.width=500'>500)this.width=500'>/**//*500)this.width=500'> * ============================================================500)this.width=500'> * Copyright (C) 2006 500)this.width=500'> * ------------------------------------------------------------500)this.width=500'> * CVS $Author: BlueDavy $500)this.width=500'> * ------------------------------------------------------------500)this.width=500'> * 事件管理器500)this.width=500'> * 1、事件的注册/反注册500)this.width=500'> * 2、事件的调用500)this.width=500'> * 3、事件的拦截器(事件执行前和事件执行后)500)this.width=500'> * TODO：事件执行的有效范围500)this.width=500'> * 拦截器的有效范围500)this.width=500'> * COR Pattern500)this.width=500'> * ============================================================500)this.width=500'> */500)this.width=500'> var EventManager=Class.create();500)this.width=500'> 500)this.width=500'> // 事件集合500)this.width=500'>500)this.width=500'> EventManager.events=500)this.width=500'>{};500)this.width=500'> 500)this.width=500'> // 注册事件500)this.width=500'>500)this.width=500'> EventManager.registerEvent=function(eventalias,event)500)this.width=500'>{500)this.width=500'> EventManager.events[eventalias]=event;500)this.width=500'> }500)this.width=500'> 500)this.width=500'> // 反注册事件500)this.width=500'>500)this.width=500'> EventManager.unregisterEvent=function(eventalias)500)this.width=500'>{500)this.width=500'> EventManager.events[eventalias]=null;500)this.width=500'> }500)this.width=500'> 500)this.width=500'> // 拦截器集合500)this.width=500'>500)this.width=500'> EventManager.interceptors=500)this.width=500'>{};500)this.width=500'> 500)this.width=500'> // 拦截器常量定义500)this.width=500'>500)this.width=500'> EventManager.Interceptor=500)this.width=500'>{500)this.width=500'> 500)this.width=500'> BEFORE:"before",500)this.width=500'> 500)this.width=500'> AFTER:"after"500)this.width=500'> 500)this.width=500'> }500)this.width=500'> 500)this.width=500'> // 事件的调用500)this.width=500'>500)this.width=500'> EventManager.invoke=function(eventalias)500)this.width=500'>{500)this.width=500'>500)this.width=500'> return function()500)this.width=500'>{500)this.width=500'> var bindevent=EventManager.events[eventalias];500)this.width=500'>500)this.width=500'> if(bindevent!=null)500)this.width=500'>{500)this.width=500'>500)this.width=500'> try500)this.width=500'>{500)this.width=500'> EventManager.invokeInterceptor(eventalias,EventManager.Interceptor.BEFORE);500)this.width=500'> bindevent.apply(this,[event]);500)this.width=500'> EventManager.invokeInterceptor(eventalias,EventManager.Interceptor.AFTER);500)this.width=500'> }500)this.width=500'>500)this.width=500'> catch(e)500)this.width=500'>{500)this.width=500'> // 不做任何提示500)this.width=500'> }500)this.width=500'> }500)this.width=500'> }500)this.width=500'> }500)this.width=500'> 500)this.width=500'> // 执行拦截器500)this.width=500'>500)this.width=500'> EventManager.invokeInterceptor=function(eventalias,type)500)this.width=500'>{500)this.width=500'> var typeInterceptors=EventManager.interceptors[type];500)this.width=500'>500)this.width=500'> if(typeInterceptors==null)500)this.width=500'>{500)this.width=500'> return;500)this.width=500'> }500)this.width=500'> var interceptors=typeInterceptors[eventalias];500)this.width=500'>500)this.width=500'> if(interceptors==null)500)this.width=500'>{500)this.width=500'> return;500)this.width=500'> }500)this.width=500'>500)this.width=500'> for(var i=0;i<interceptors.length;i++)500)this.width=500'>{500)this.width=500'>500)this.width=500'> try500)this.width=500'>{500)this.width=500'> interceptors[i].apply(this,[event]);500)this.width=500'> }500)this.width=500'>500)this.width=500'> catch(e)500)this.width=500'>{500)this.width=500'> // 不做任何提示500)this.width=500'> }500)this.width=500'> }500)this.width=500'> }500)this.width=500'> 500)this.width=500'> // 注册方法执行前的拦截器500)this.width=500'>500)this.width=500'> EventManager.addBeforeInterceptor=function(eventalias,interceptor)500)this.width=500'>{500)this.width=500'> EventManager.addInterceptor(eventalias,interceptor,EventManager.Interceptor.BEFORE);500)this.width=500'> }500)this.width=500'> 500)this.width=500'> // 删除方法执行前的拦截器500)this.width=500'>500)this.width=500'> EventManager.removeBeforeInterceptor=function(eventalias,interceptor)500)this.width=500'>{500)this.width=500'> EventManager.removeInterceptor(eventalias,interceptor,EventManager.Interceptor.BEFORE);500)this.width=500'> }500)this.width=500'> 500)this.width=500'> // 注册方法执行后的拦截器500)this.width=500'>500)this.width=500'> EventManager.addAfterInterceptor=function(eventalias,interceptor)500)this.width=500'>{500)this.width=500'> EventManager.addInterceptor(eventalias,interceptor,EventManager.Interceptor.AFTER);500)this.width=500'> }500)this.width=500'> 500)this.width=500'> // 删除方法执行后的拦截器500)this.width=500'>500)this.width=500'> EventManager.removeAfterInterceptor=function(eventalias,interceptor)500)this.width=500'>{500)this.width=500'> EventManager.removeInterceptor(eventalias,interceptor,EventManager.Interceptor.AFTER);500)this.width=500'> }500)this.width=500'> 500)this.width=500'> // 添加拦截器500)this.width=500'>500)this.width=500'> EventManager.addInterceptor=function(eventalias,interceptor,type)500)this.width=500'>{500)this.width=500'> var typeInterceptors=EventManager.interceptors[type];500)this.width=500'>500)this.width=500'> if(typeInterceptors==null)500)this.width=500'>{500)this.width=500'>500)this.width=500'> typeInterceptors=500)this.width=500'>{};500)this.width=500'> }500)this.width=500'> var interceptors=typeInterceptors[eventalias];500)this.width=500'>500)this.width=500'> if(interceptors==null)500)this.width=500'>{500)this.width=500'> interceptors=new Array();500)this.width=500'> }500)this.width=500'> interceptors.push(interceptor);500)this.width=500'> typeInterceptors[eventalias]=interceptors;500)this.width=500'> EventManager.interceptors[type]=typeInterceptors;500)this.width=500'> }500)this.width=500'> 500)this.width=500'> // 删除拦截器500)this.width=500'>500)this.width=500'> EventManager.removeInterceptor=function(eventalias,interceptor,type)500)this.width=500'>{500)this.width=500'> var typeInterceptors=EventManager.interceptors[type];500)this.width=500'>500)this.width=500'> if(typeInterceptors==null)500)this.width=500'>{500)this.width=500'> return;500)this.width=500'> }500)this.width=500'> var interceptors=typeInterceptors[eventalias];500)this.width=500'>500)this.width=500'> if(interceptors==null)500)this.width=500'>{500)this.width=500'> return;500)this.width=500'> }500)this.width=500'> interceptors.remove(interceptor);500)this.width=500'> typeInterceptors[eventalias]=interceptors;500)this.width=500'> EventManager.interceptors[type]=typeInterceptors;500)this.width=500'> }
示例如下：
500)this.width=500'><html>500)this.width=500'><head>500)this.width=500'><meta http-equiv="Content-Type" content="text/html;charset=GBK" /> 500)this.width=500'><title>::事件管理器示例::</title>500)this.width=500'><script src="js/prototype.js"></script>500)this.width=500'><script src="js/EventManager.js"></script>500)this.width=500'></head>500)this.width=500'><body>500)this.width=500'> <input type=button name=btnTest value=演示>500)this.width=500'></body>500)this.width=500'>500)this.width=500'><script>500)this.width=500'>500)this.width=500'>500)this.width=500'>500)this.width=500'> function newEvent()500)this.width=500'>{500)this.width=500'> alert("新增动作");500)this.width=500'> }500)this.width=500'> 500)this.width=500'>500)this.width=500'> function beforeNewEvent()500)this.width=500'>{500)this.width=500'> alert("新增动作执行前");500)this.width=500'> }500)this.width=500'> 500)this.width=500'>500)this.width=500'> function validatorNewEvent()500)this.width=500'>{500)this.width=500'> alert("执行校验拦截器");500)this.width=500'> }500)this.width=500'> 500)this.width=500'>500)this.width=500'> function afterNewEvent()500)this.width=500'>{500)this.width=500'> alert("新增动作执行后");500)this.width=500'> }500)this.width=500'>500)this.width=500'> EventManager.registerEvent("newevent",newEvent);500)this.width=500'> EventManager.addBeforeInterceptor("newevent",beforeNewEvent);500)this.width=500'> EventManager.addBeforeInterceptor("newevent",validatorNewEvent);500)this.width=500'> EventManager.addAfterInterceptor("newevent",afterNewEvent);500)this.width=500'> 500)this.width=500'> $('btnTest').onclick=EventManager.invoke("newevent");500)this.width=500'>500)this.width=500'></script>500)this.width=500'></html>
|
|
|
回复:js版事件管理器
软件技术
21312(游客)发表评论于2006/9/10 9:10:32 |
| 32423500)this.width=500" align=top border=0><html>500)this.width=500" align=top border=0><head>500)this.width=500" align=top border=0><meta http-equiv="Content-Type" content="text/html;charset=GBK" /> 500)this.width=500" align=top border=0><title>::事件管理器示例::</title>500)this.width=500" align=top border=0><script src="js/prototype.js"></script>500)this.width=500" align=top border=0><script src="js/EventManager.js"></script>500)this.width=500" align=top border=0></head>500)this.width=500" align=top border=0><body>500)this.width=500" align=top border=0> <input type=button name=btnTest value=演示>500)this.width=500" align=top border=0></body>500)this.width=500" align=top border=0>500)this.width=500" align=top border=0><script>500)this.width=500" border=0>500)this.width=500" align=top border=0>500)this.width=500" align=top border=0>500)this.width=500" align=top border=0> function newEvent()500)this.width=500" border=0>{500)this.width=500" align=top border=0> alert("新增动作");500)this.width=500" align=top border=0> }500)this.width=500" align=top border=0> 500)this.width=500" align=top border=0> function500)this.width=500" align=top border=0> beforeNewEvent()500)this.width=500" border=0>{500)this.width=500" align=top border=0> alert("新增动作执行前");500)this.width=500" align=top border=0> }500)this.width=500" align=top border=0> 500)this.width=500" align=top border=0>500)this.width=500" align=top border=0> function validatorNewEvent()500)this.width=500" border=0>{500)this.width=500" align=top border=0> alert("执行校验拦截器");500)this.width=500" align=top border=0> }500)this.width=500" align=top border=0> 500)this.width=500" align=top border=0>500)this.width=500" align=top border=0> function afterNewEvent()500)this.width=500" border=0>{500)this.width=500" align=top border=0> alert("新增动作执行后");500)this.width=500" align=top border=0> }500)this.width=500" align=top border=0>500)this.width=500" align=top border=0> EventManager.registerEvent("newevent",newEvent);500)this.width=500" align=top border=0> EventManager.addBeforeInterceptor("newevent",beforeNewEvent);500)this.width=500" align=top border=0> EventManager.addBeforeInterceptor("newevent",validatorNewEvent);500)this.width=500" align=top border=0> EventManager.addAfterInterceptor("newevent",afterNewEvent);500)this.width=500" align=top border=0> 500)this.width=500" align=top border=0> $('btnTest').onclick=EventManager.invoke("newevent");500)this.width=500" align=top border=0>500)this.width=500" align=top border=0></script>500)this.width=500" align=top border=0></html> |
|
» 1 »
|