/** * 回调函数机制 * 支持多个回调函数绑定 * @author tangbin * @see http://www.planeart.cn/?p=1182 * @namespace */ var callback = (function () { var that = this, cache = {}, fName = '${callback}', fVal = 1; /** * @scope callback */ return { /** * 绑定回调函数 * @example var loadEndFn = function (photoId, photoIndex) { * // [code..] * }; * callback.bind('getData', loadEndFn); * @param {String} 名称 * @param {Function} 要绑定的回调函数 */ bind: function (name, callback) { !cache[name] && (cache[name] = {}); !callback[fName] && (callback[fName] = fVal ++); cache[name][callback[fName]] = callback; }, /** * 移除回调函数 * @example var loadEndFn = function (photoId, photoIndex) { * // [code..] * }; * callback.unbind('getData', loadEndFn); * @param {String} 名称 * @param {Function} 要卸载的回调函数 */ unbind: function(name, callback) { callback === undefined ? delete cache[name] : callback[fName] && (delete cache[name][callback[fName]]); }, /** * 触发回调函数 * @example var photoId = 34356, photoIndex = 0; * callback.trigger('getData', [photoId, photoIndex]); * @param {String} 名称 * @param {Array} (可选)传递给事件处理函数的附加参数 */ trigger: function (name, data) { var i, ret, callbacks = cache[name]; if (callbacks) for (i in callbacks) ret = callbacks[i].apply(that, data); return ret; } }; })();
原文链接:http://www.planeart.cn/?p=1182
var _cache = {}; var broadcast = { /** * 派发 * @param {[type]} type 事件类型 * @param {[type]} data 回调数据 * @return {[type]} [description] */ fire:function(type, data){ var listeners = _cache[type],len = 0; if(!$.isUndefined(listeners)){ var args = [].slice.call(arguments); args = args.length > 2 ? args.splice(2, args.length-1) : []; args = [data].concat(args); len = listeners.length; for(var i = 0; i<len;i++){ var listener = listeners[i]; if(listener && listener.callback) { args = args.concat(listener.args); listener.callback.apply(listener.scope, args); } } } return this; }, /** * 订阅广播事件 * @param {[type]} types 事件类型,支持,分隔符 * @param {Function} callback 回调函数 * @param {[type]} scope 回调函数上下文 * @return {[type]} this */ subscribe:function(types, callback, scope){ types = types || []; var args = [].slice.call(arguments); if($.isString(types)){ types = types.split(','); } var len = types.length; if(len===0){ return this; } args = args.length > 3 ? args.splice(3, args.length-1) : []; for(var i = 0;i<len;i++){ var type = types[i]; _cache[type] = _cache[type] || []; _cache[type].push({callback:callback,scope:scope,args:args}); } return this; }, /** * 退订 * @param {[type]} type [description] * @param {Function} callback 假如传入则移出传入的监控事件,否则移出全部 * @return {[type]} [description] */ unsubscribe:function(type, callback, scope){ var listeners = _cache[type]; if (!listeners) { return this; } if(callback){ var len = listeners.length, tmp = []; for(var i=0; i<len; i++) { var listener = listeners[i]; if(listener.callback == callback && listener.scope == scope) { } else { tmp.push(listener); } } listeners = tmp; }else{ listeners.length = 0; } return this; }, /** * 订阅别名 * @return {[type]} [description] */ on:function(){ return this.subscribe.apply(this,arguments); }, /** * 退订别名 * @return {[type]} [description] */ un:function(){ return this.unsubscribe.apply(this,arguments); }, dispatch:function(){ return this.fire.apply(this,arguments); }, removeAll:function(){ _cache = {}; return this; } };
broadcast.fire('event name', json); broadcast.on('event name', function(data){ console.log(data); });
相关推荐
### JavaScript自定义事件功能与用法实例分析 #### 概述 在JavaScript中,自定义事件(也称为自定义事件)是一种强大的工具,允许开发者在不同的模块或组件之间建立通信渠道。这种通信机制基于观察者模式,即一个...
这种做法模拟了事件触发的过程,但没有使用原生的事件系统,而是基于对象属性来管理事件处理器。 6. **事件委托**: 虽然示例中没有提到事件委托,但它是一个相关的概念,可以用来优化事件处理。事件委托允许在一...
在本项目中,“Javascript自定义菜单插件”是一个专门为网页设计的交互式菜单工具,开发者通过编写JS代码实现了这个插件,旨在提供一个灵活、可定制的菜单解决方案。虽然最初希望该插件能带来经济效益,但最终决定将...
Dean Edwards 的 `addEvent` 实现则更加复杂,它不仅支持事件绑定,还提供了解绑事件的功能,并且通过哈希表的方式管理事件处理器,使得每个事件处理器可以被唯一标识。 ```javascript // addEvent/removeEvent ...
JavaScript自定义菜单插件是一种基于Web的交互式用户界面组件,它允许开发者为网页或应用程序创建可定制的、动态的菜单系统。JavaScript是Web开发中的关键脚本语言,用于实现客户端的动态功能,而js是它的缩写。在这...
自定义事件可以通过原生的JavaScript对象Event、CustomEvent以及dispatchEvent来创建和管理。Event是所有事件的基类,而CustomEvent继承自Event并允许开发者创建包含额外数据的事件对象。使用CustomEvent时,可以在...
自定义事件不仅可以帮助我们在复杂的单页面应用(SPA)中管理状态和行为,还可以在开发组件化界面时,实现组件间的解耦和通信。理解和掌握自定义事件的实现机制,对于前端开发者来说是一项十分重要的技能。
自定义事件则允许开发者根据需求扩展功能,增加交互性。在这个场景下,我们讨论的是如何在树结构组件中实现`loadtree`的延迟加载,并通过自定义事件处理用户交互,如右键点击或子节点操作。 延迟加载,或称为按需...
fullCalendar是一款广受欢迎的JavaScript日历插件,它能够方便地在网页中展示日程安排和事件管理。通过对原版fullCalendar进行改造,我们可以实现更加个性化的功能,如改变事件背景色、自定义事件标题、去除星期显示...
《ArcGIS API for JavaScript 4.14 自定义测量工具详解》 在Web GIS开发中,ArcGIS API for JavaScript是一个强大的工具,它提供了丰富的功能,包括地图显示、数据操作、地理分析等。本文将深入探讨如何利用ArcGIS ...
3. 实现JavaScript逻辑:在JavaScript中,我们需要创建一个函数或者类来管理弹出框的状态。这包括初始化弹出框、显示和隐藏弹出框、处理用户交互以及执行动画效果。 四、实际应用 自定义JavaScript弹出框组件广泛...
本话题主要聚焦于如何利用ArcGIS for JavaScript加载天地图以及添加自定义图层。 首先,让我们深入了解ArcGIS for JavaScript的核心概念。它基于ESRI的地理信息系统技术,提供了丰富的API接口,可以实现地图的创建...
在IT领域,基于JavaScript的可视化流程自定义设计器是一种强大的工具,它允许用户通过图形界面来构建、编辑和管理流程图。这种技术广泛应用于业务流程管理(BPM)、工作流自动化、系统集成等领域,使得非技术人员也...
自定义事件是JavaScript编程中的一个高级概念,允许开发者创建并触发不在标准事件列表中的事件。在jQuery中,通过`.trigger()`和`.bind()`方法,我们可以方便地实现自定义事件的创建、绑定和触发,从而增强代码的可...
这些事件处理程序可以捕获到JavaScript通过AJAX发送的异常,并生成一个自定义的响应,包含详细的错误信息,但要确保在生产环境中不会泄露敏感信息。 结合使用自定义异常对象和ASP.NET的错误处理,我们可以构建一个...
本教程将详细介绍如何在JavaScript中自定义Alert样式的实践方法。 首先,我们要明白,由于JavaScript的Alert是浏览器内置的功能,其样式受浏览器控制,不能直接通过CSS修改。但是,我们可以通过创建自定义的HTML和...
在示例中,`MyEvent` 类提供了一个基础框架来管理和触发自定义事件。`MyEvent` 类包含一个`handler`属性来存储事件处理程序,以及`addHandler`、`fire`和`removeHandler`方法来分别添加、触发和移除事件处理程序。 ...
**解决方案**:创建一个自定义的事件处理函数来管理事件的触发逻辑。 ```javascript function addEvent(obj, type, fn) { var saved = obj['on' + type] || function(){}; obj['on' + type] = function() { ...
在"JavaScript_LLM自定义聊天机器人控制台.zip"这个压缩包中,我们可以推测其主要内容是关于如何使用JavaScript来构建一个聊天机器人的控制台。下面将详细探讨JavaScript在聊天机器人开发中的应用和相关知识点。 1....