nodeJs+jquery实现聊天插入表情功能

雨点打透心脏的1/2处 2022-08-18 01:00 23阅读 0赞

在实习期间做一个nodejs的项目时，分配了做一个聊天室的任务，然后就喜欢上了这个。。。想着而不只是聊天，还可以加入类似qq表情的功能。发现可以进入Jquery官方网站下载该demo，但是在运用的过程中，难免会遇到各种各样的问题，在自己的信息研究之下，终于实现了该功能。  
官方demo下载：[http://www.jq22.com/jquery-info365][http_www.jq22.com_jquery-info365]  
问题解决：  
1.浏览器判别问题：在官方文件中，jquery还处于1.9以下，所有有句话在运行的过程中会出错：`if(!$.browser.msie) return;`  
上网搜索会发现，这是判别浏览器的版本的，现在1.9以上的jquery插件已经不支持该语句了，可以改换成：

if(!$.support.msie) return;

这样就可以了。  
2.在输入框输入表情之后会在聊天敞口信息显示，在textarea中现实的转换的文字代号，那么在显示的聊天记录里面需要重新转换为图片，下面的一段代码就是转换过程。  
`//查看结果 function replace_em(str){ str = str.replace(/\</g,'<'); str = str.replace(/\>/g,'>'); str = str.replace(/\n/g,'<br/>'); str = str.replace(/\[em_([0-9]*)\]/g,'<img src="arclist/$1.gif" border="0" />'); return str; }`  
下面一段代码是显示在msgDiv中的，既是在点击发送按钮时的动作，其中sub\_btn是按钮的id，show是显示的div的id，在实际应用中可以自己根据内容修改。

$(".sub_btn").click(function(){ 
            var str = $("#saytext").val();
            $("#show").html(replace_em(str));
        });

[http_www.jq22.com_jquery-info365]: http://www.jq22.com/jquery-info365

发表评论取消回复

表情：

评论列表（有 0 条评论，23人围观）

还没有评论，来说两句吧...

相关阅读

相关 Netty代码实现聊天功能

前言 Netty实战 -------------------- Netty实战 Reactor线程模型单线程模型：所有的IO操作都由同一个NIO线程处理

灰太狼/ 2023年01月13日 10:55/ 0 赞/ 198 阅读

相关局域网聊天 java_java实现简易局域网聊天功能

本文实例为大家分享了java使用UDP模式编写聊天程序的具体代码，供大家参考，具体内容如下 Java代码： /\ 使用UDP模式,编写一个聊天程序有发送和接收数据2部

深藏阁楼爱情的钟/ 2022年11月02日 03:54/ 0 赞/ 249 阅读

相关 nodeJs+jquery实现聊天插入表情功能

在实习期间做一个nodejs的项目时，分配了做一个聊天室的任务，然后就喜欢上了这个。。。想着而不只是聊天，还可以加入类似qq表情的功能。发现可以进入Jquery官方网站下载该d

雨点打透心脏的1/2处/ 2022年08月18日 01:00/ 0 赞/ 24 阅读

相关 MINA 实现聊天功能

原文同步至 [http://www.waylau.com/mina-chat/][http_www.waylau.com_mina-chat] 在《[MINA 快速入门][M

╰+哭是因爲堅強的太久メ/ 2022年08月07日 13:40/ 0 赞/ 231 阅读

相关 Netty 实现 WebSocket 聊天功能

Netty 实现 WebSocket 聊天功能原文同步至[http://www.waylau.com/netty-websocket-chat/][http_www.w

亦凉/ 2022年08月07日 08:50/ 0 赞/ 311 阅读

相关 Netty 实现 WebSocket 聊天功能

上一次我们用 [Netty][] 快速实现了一个 Java 聊天程序（见[http://www.waylau.com/netty-chat/][http_www.waylau.

朴灿烈づ我的快乐病毒、/ 2022年06月17日 05:39/ 0 赞/ 372 阅读

相关 Netty 实现聊天功能

[Netty][] 是一个 Java NIO 客户端服务器框架，使用它可以快速简单地开发网络应用程序，比如服务器和客户端的协议。Netty 大大简化了网络程序的开发过程比如 T

曾经终败给现在/ 2022年06月17日 05:39/ 0 赞/ 278 阅读

相关 MySQL 插入emoji表情字符

MySQL 插入emoji表情字符默认情况下，MySQL数据库不支持插入某些表情字符。类似报错 (Mysql2::Error: Incorrect string v

悠悠/ 2022年06月07日 13:38/ 0 赞/ 314 阅读

相关 python实现聊天功能

python的功能确实强大几行代码就能实现聊天功能服务端: from socket import socket def main

我会带着你远行/ 2022年05月25日 23:44/ 0 赞/ 255 阅读

相关 C#实现聊天功能

目录基础概念 UI层所需控件及布局如下（左图为基础版，右图为加强版）在frmMain窗体下声明.net对象和公共变量 frmMain窗体加载时，启动消息监听线

绝地灬酷狼/ 2021年09月24日 23:28/ 0 赞/ 436 阅读