jQuery.chatbox 轻量级jQuery聊天窗插件开源项目

我要开发同款
匿名用户2015年12月18日
125阅读
开发技术JavaScriptHTML/CSS
所属分类其他jQuery插件、jQuery插件
授权协议MIT

作品详情

jQuery.chatbox说明文档特性1.轻量级动画特效以及友好的界面2.支持多窗口3.完善的回调函数以实现自定义功能4.多种调用方式4.良好的封装以及扩展性5.每个聊天窗对象实例以data属性的形式附加在聊天窗DOM对象上(如果你想获得某个特定插件的实例,可以直接从页面元素中获取:$('{boxId}').data('chatbox'))配置项

配置项分为全局配置项和实例配置项

全局配置项:参数            类型           默认值                说明-----------------------------------------------------------------------------------------------id              number          null                  当前用户的id,也就是发送者的id,必须是唯一值user            string          null                  发送者的显示名称,可以是昵称用户名等,不要求唯一debug           boolean         false                 是否打开调试功能idPrefix        string          'chatbox_'            生成页面DOM元素的id值实例配置项:参数            类型           默认值                说明-----------------------------------------------------------------------------------------------id              number          null                  接收者的id,同时也会作为实例id,必须是唯一值user            string          null                  接收者的显示名称,可以是昵称用户名等,不要求唯一title           string          'Chat with '+{user}   聊天窗的标题回调函数回调函数也分为两种,一种是全局回调函数另一种是实例回调函数。但是有点Javascript基础的开发者应该了解不管是哪种类型的回调函数我们都应该以传递函数引用的方式来调用,而不是对每个实例创建一个函数副本。这样会造成内存浪费。全局回调函数不会在实例化每个聊天窗对象时重复创建副本分配给每个对象实例,而实例回调函数会。因此在不需要为每个独立的聊天窗分配不同的回调功能时使用实例回调函数也应该以传递函数引用的方式来分配回调函数以节省内存空间。回调函数参考:函数名                  参数       说明-----------------------------------------------------------------------------------------------onChatboxCreate                     创建聊天窗时触发onChatboxEnable                     聊天窗被启用时触发onChatboxDisable                    聊天窗被禁用时触发onMessageSend           msg         发送消息时触发,唯一参数:消息内容msgonMessageReceive        msg         收到消息时触发,唯一参数:消息内容msgonMessageSystem         msg         收到系统消息时触发,唯一参数:消息内容msgonChatboxDestroy                    销毁聊天窗时触发 优先级:实例回调函数优先级高于全局回调函数,也就是说实例配置项中的回调函数会覆盖全局配置项中同名的回调函数。 this指针:this指针经由apply或者call方法已经指向调用该方法的实例。API(属性和方法)全局API:属性/方法名       类型       参数          说明-----------------------------------------------------------------------------------------------globalOptions     属性        无           保存所有聊天窗的全局配置项getQueue()        方法        无           返回当前聊天窗的实例队列实例API:属性/方法名       类型      参数              说明-----------------------------------------------------------------------------------------------$elem             属性        无              保存着当前聊天窗实例的jQuery对象opts              属性        无              保存着当前聊天窗实例的初始化选项show()            方法        无              显示聊天窗hide()            方法        无              隐藏聊天窗enable()          方法        无              启用聊天窗disable()         方法        无              禁用聊天窗message()         方法        msg,type        设置接收到的消息到聊天窗,两个参数:消息内容msg、消息类型typeblink()           方法        无              高亮标题栏闪烁提示destroy()         方法        无              无调用方式设定全局配置项: 直接定义配置对象globalOptions,未给定的配置项依旧会使用默认值并不会被该配置对象覆盖$.chatbox.globalOptions = {    id:10000,    user:'Jason',    debug:true,    onChatboxCreate:function(){        //要执行的代码    }}或者以附加属性的方式$.chatbox.globalOptions.id = 10000;$.chatbox.globalOptions.user = 'Jason';$.chatbox.globalOptions.onChatboxCreate = function(){    //要执行的代码}; 初始化聊天窗: $.chatbox({    id:11254,    user:'Tony',    title:'Chat with Tony',    onChatboxCreate:function(){        //要执行的代码    }}); 调用API方法: 第一种调用方式$.chatbox({instanceId}).message({message content});第二种调用方式$({boxId}).data('chatbox').message({message content});
声明:本文仅代表作者观点,不代表本站立场。如果侵犯到您的合法权益,请联系我们删除侵权资源!如果遇到资源链接失效,请您通过评论或工单的方式通知管理员。未经允许,不得转载,本站所有资源文章禁止商业使用运营!
下载安装【程序员客栈】APP
实时对接需求、及时收发消息、丰富的开放项目需求、随时随地查看项目状态

评论