首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Web前端 >

基于事件模型的同域内全局事件监听触发兑现

2012-12-24 
基于事件模型的同域内全局事件监听触发实现构思:1、在应用中,由于用了iframe,为了方便各个页面不用window.p

基于事件模型的同域内全局事件监听触发实现
构思:
1、在应用中,由于用了iframe,为了方便各个页面不用window.parent.parent这样的调用考虑利用事件模型对此问题进行解决。

2、应用

$.bindge("eventname",function(event,...){   ...});$.triggerge("eventname",params);


3、实现
/** * 客户端统一事件管理器 */(function($, undefined){    /**     * 定义全局事件管理器     */    var _globalEventManagerWin_ = window;    var _$globalEventManager = null;    while (!_$globalEventManager)    {        try        {            if (!_globalEventManagerWin_.closed                    && _globalEventManagerWin_._$globalEventManager)            {            _$globalEventManager = _globalEventManagerWin_._$globalEventManager;                break;            }        }        catch (e)        {            // do nothing        }        if (!_globalEventManagerWin_.closed                && _globalEventManagerWin_.parent != null                && _globalEventManagerWin_.parent != _globalEventManagerWin_)        {            _globalEventManagerWin_ = _globalEventManagerWin_.parent;        }        else if (!_globalEventManagerWin_.closed                && _globalEventManagerWin_.opener != null                && _globalEventManagerWin_.opener != _globalEventManagerWin_)        {            _globalEventManagerWin_ = _globalEventManagerWin_.opener;        }        else        {        //全局事件管理器        var GlobalEventManager = function(config){                };        //全局事件管理器属性:        GlobalEventManager.prototype.$globalEventHandle = $("<_global_event_handle/>");        //        GlobalEventManager.prototype.eventTypeCallbackMapping = {};                //全局事件管理器方法:        //添加事件监听器        GlobalEventManager.prototype.bind = function(eventType, data, callbackFn){        var _self = this;        if(!callbackFn && $.isFunction(data)){        callbackFn = data;        data = [];        }        //压入堆栈        if(!_self.eventTypeCallbackMapping[eventType]){        _self.eventTypeCallbackMapping[eventType] = $.Callbacks("unique");        _self.$globalEventHandle.bind(eventType, data, function(event){        console.log(Array.prototype.slice.call(arguments));        _self.eventTypeCallbackMapping[eventType].fireWith(callbackFn,Array.prototype.slice.call(arguments));        });        }        var _whenExceptionRemoveAbleFunction = function(){        try{        callbackFn.apply(callbackFn,arguments);        }catch(e){        //console.log('fire bind global event exception: ' + e);        _self.eventTypeCallbackMapping[eventType].remove(_whenExceptionRemoveAbleFunction);        }        };        _self.eventTypeCallbackMapping[eventType].add(_whenExceptionRemoveAbleFunction);        };        GlobalEventManager.prototype.trigger = function(eventType, params){        this.$globalEventHandle.trigger(eventType, params)        };                    /**             * 事件管理器全局对象             */        _$globalEventManager = new GlobalEventManager();                _globalEventManagerWin_._$globalEventManager = _$globalEventManager;        //循环调度,用以清理全局事件管理器中,已经被回收的对象        //setInterval(function(){        //        //},60 * 1000 );        }    }    //释放引用    _globalEventManagerWin_ = null;    var _globalEventCallbacks = {};    $.extend(    {        triggerGlobalEvent : function(eventType, params)        {            _$globalEventManager.trigger(eventType, params);        },         bindGlobalEvent : function(eventType, data, callbackFn)        {            _$globalEventManager.bind(eventType, data, callbackFn);        }    });    $.triggerGE = $.triggerge = $.triggerGlobalEvent;    $.bindGE = $.bindge = $.bindGlobalEvent;})(jQuery);

热点排行