0

0

将论坛帖子内容中的 smilies 表情转换为正常图片显示

php中文网

php中文网

发布时间:2016-08-08 09:30:46

|

1626人浏览过

|

来源于php中文网

原创

不久前,在调用论坛回帖内容时遇到了 smilies 表情图片为 {:4_267:} ,下面说说解决方式。

在服务端时用正则将论坛(以Discuz7.2为例)帖子内容中的 smilies 图格式化成图片标签格式,然后在标签上附加上属性,以便于在视图中使用JS处理。
当然,这个可以自己去优化一下,这里起初是为了实现正常显示图片的目的。

foreach($postList as $key=>$val)
{
	$message = preg_replace('/<i class="pstatus">.*?</i>(s|(<br>))*/is', '', $val['message']);	//去除 本帖最后由 XX 于 2014-11-6 15:25 编辑
	//...省略其他code
	//论坛回帖内容中的 表情图片
	$message = preg_replace('/{:(d)_(d+):}/im', '<img  class="smilies_n" src="" reltype="\1" relid="\2"    style="max-width:90%" style="display:none;" alt="将论坛帖子内容中的 smilies 表情转换为正常图片显示" >', $message);
	$postList[$key]['message'] = trim($message);
}

接下来在视图中引入 smilies_var.js文件

<script src="http://domain/forumdata/cache/smilies_var.js" type="text/javascript"></script>

这个JS文件的内容大概如下

AI脑图
AI脑图

AI一键生成思维导图

下载

var smthumb = '20';
var smilies_type = new Array();
smilies_type[4] = ['炮炮兵', 'dabing'];smilies_type[5] = ['柏夫', 'bofu'];
var smilies_array = new Array();
smilies_array[4] = new Array();
smilies_array[4][1] = [['267', '{:4_267:}','dabing63.gif','20','20','50'],['248', '{:4_248:}','dabing65.gif','20','20','50'],['247', '{:4_247:}','dabing69.gif','20','20','50'],['246', '{:4_246:}','dabing39.gif','20','20','50'],['245', '{:4_245:}','dabing05.gif','20','14','50'],['244', '{:4_244:}','dabing45.gif','20','20','50'],['243', '{:4_243:}','dabing16.gif','20','20','50'],['242', '{:4_242:}','dabing67.gif','20','16','50'],['241', '{:4_241:}','dabing02.gif','10','20','25'],['240', '{:4_240:}','dabing60.gif','20','17','50'],['239', '{:4_239:}','dabing46.gif','20','20','50'],['238', '{:4_238:}','dabing56.gif','20','20','50'],['237', '{:4_237:}','dabing34.gif','20','20','50'],['236', '{:4_236:}','dabing06.gif','20','20','50'],['235', '{:4_235:}','dabing10.gif','20','20','50'],['234', '{:4_234:}','dabing04.gif','20','20','50'],['233', '{:4_233:}','dabing11.gif','20','20','50'],['249', '{:4_249:}','dabing14.gif','10','20','25'],['250', '{:4_250:}','dabing54.gif','20','20','50'],['266', '{:4_266:}','dabing38.gif','20','20','50'],['265', '{:4_265:}','dabing17.gif','20','20','50'],['264', '{:4_264:}','dabing66.gif','20','20','50'],['263', '{:4_263:}','dabing64.gif','20','16','50'],['262', '{:4_262:}','dabing18.gif','20','20','50'],['261', '{:4_261:}','dabing68.gif','20','20','50'],['260', '{:4_260:}','dabing47.gif','20','20','50'],['259', '{:4_259:}','dabing41.gif','20','20','50'],['258', '{:4_258:}','dabing51.gif','20','20','50'],['257', '{:4_257:}','dabing52.gif','20','20','50'],['256', '{:4_256:}','dabing40.gif','20','20','50'],['255', '{:4_255:}','dabing50.gif','20','20','50'],['254', '{:4_254:}','dabing08.gif','20','19','50'],['253', '{:4_253:}','dabing58.gif','20','20','50'],['252', '{:4_252:}','dabing25.gif','20','20','50'],['251', '{:4_251:}','dabing57.gif','20','15','50'],['232', '{:4_232:}','dabing29.gif','20','20','50'],['231', '{:4_231:}','dabing31.gif','20','20','50'],['212', '{:4_212:}','dabing03.gif','20','20','50'],['211', '{:4_211:}','dabing01.gif','20','20','50'],['210', '{:4_210:}','dabing71.gif','20','20','50']];
smilies_array[4][2] = [['209', '{:4_209:}','dabing55.gif','20','17','50'],['208', '{:4_208:}','dabing53.gif','20','20','50'],['207', '{:4_207:}','dabing22.gif','20','20','50'],['206', '{:4_206:}','dabing28.gif','20','20','50'],['205', '{:4_205:}','dabing36.gif','20','20','50'],['204', '{:4_204:}','dabing48.gif','20','20','50'],['203', '{:4_203:}','dabing42.gif','20','20','50'],['202', '{:4_202:}','dabing12.gif','20','20','50'],['201', '{:4_201:}','dabing33.gif','20','20','50'],['200', '{:4_200:}','dabing20.gif','20','20','50'],['199', '{:4_199:}','dabing44.gif','20','20','50'],['198', '{:4_198:}','dabing23.gif','20','20','50'],['197', '{:4_197:}','dabing07.gif','20','20','50'],['213', '{:4_213:}','dabing43.gif','20','20','50'],['214', '{:4_214:}','dabing72.gif','20','20','50'],['230', '{:4_230:}','dabing19.gif','20','20','50'],['229', '{:4_229:}','dabing59.gif','20','20','50'],['228', '{:4_228:}','dabing27.gif','20','20','50'],['227', '{:4_227:}','dabing21.gif','20','20','50'],['226', '{:4_226:}','dabing30.gif','20','20','50'],['225', '{:4_225:}','dabing24.gif','20','20','50'],['224', '{:4_224:}','dabing13.gif','20','20','50'],['223', '{:4_223:}','dabing37.gif','20','20','50'],['222', '{:4_222:}','dabing62.gif','19','20','46'],['221', '{:4_221:}','dabing70.gif','20','20','50'],['220', '{:4_220:}','dabing09.gif','20','20','50'],['219', '{:4_219:}','dabing15.gif','16','20','39'],['218', '{:4_218:}','dabing61.gif','20','20','50'],['217', '{:4_217:}','dabing26.gif','20','20','50'],['216', '{:4_216:}','dabing35.gif','20','20','50'],['215', '{:4_215:}','dabing49.gif','20','20','50'],['196', '{:4_196:}','dabing32.gif','20','20','50']];
smilies_array[5] = new Array();
...

在视图中将下面的 JS放在末尾,否则会因加载顺序导致没能获取到dom或smilies_var.js中的数组而报错。
这里使用的是 jQuery来操作

var baseSrc = 'http://domain/images/smilies/';	//smilies_var.js中的图片存放地址
var OSmilies = $('.smilies_n');	//所有class名为 .smilies_n 标签
var i, flag, OEle, OAttr, OId, OName, OArr;
for(i=0;i<OSmilies.length;i++)
{
	flag = false;
	if(OSmilies[i] == undefined) continue;
	OEle = $(OSmilies[i]);	//第几个标签
	OAttr = OEle.attr('reltype');//标签的属性值
	OId = parseInt(OEle.attr('relid')); 
	if( smilies_type[OAttr] == undefined || smilies_array[OAttr] == undefined || OId <= 0 ) continue;
	OName = smilies_type[OAttr][1];	//type的名称 dabing、bofu
	OArr = smilies_array[OAttr];	//存放图片名的大数组
	
	for(sj=1;sj<OArr.length;sj++)
	{
		if(flag) break;	//若找到了 OId对应的图片,退出当前OId的循环
		for(j=0;j<OArr[sj].length;j++)
		{
			if( OArr[sj][j][0] == OId )
			{
				OEle.attr('src', baseSrc + OName + '/' + OArr[sj][j][2]);
				OEle.show();
				flag = true;
				break;
			}
		}
	}
}

以上就可以对论坛内容中的表情图片转换,关于其他的BbCode后续整理了再发。

以上就介绍了将论坛帖子内容中的 smilies 表情转换为正常图片显示,包括了方面的内容,希望对PHP教程有兴趣的朋友有所帮助。

热门AI工具

更多
DeepSeek
DeepSeek

幻方量化公司旗下的开源大模型平台

豆包大模型
豆包大模型

字节跳动自主研发的一系列大型语言模型

通义千问
通义千问

阿里巴巴推出的全能AI助手

腾讯元宝
腾讯元宝

腾讯混元平台推出的AI助手

文心一言
文心一言

文心一言是百度开发的AI聊天机器人,通过对话可以生成各种形式的内容。

讯飞写作
讯飞写作

基于讯飞星火大模型的AI写作工具,可以快速生成新闻稿件、品宣文案、工作总结、心得体会等各种文文稿

即梦AI
即梦AI

一站式AI创作平台,免费AI图片和视频生成。

ChatGPT
ChatGPT

最最强大的AI聊天机器人程序,ChatGPT不单是聊天机器人,还能进行撰写邮件、视频脚本、文案、翻译、代码等任务。

相关专题

更多
pixiv网页版官网登录与阅读指南_pixiv官网直达入口与在线访问方法
pixiv网页版官网登录与阅读指南_pixiv官网直达入口与在线访问方法

本专题系统整理pixiv网页版官网入口及登录访问方式,涵盖官网登录页面直达路径、在线阅读入口及快速进入方法说明,帮助用户高效找到pixiv官方网站,实现便捷、安全的网页端浏览与账号登录体验。

616

2026.02.13

微博网页版主页入口与登录指南_官方网页端快速访问方法
微博网页版主页入口与登录指南_官方网页端快速访问方法

本专题系统整理微博网页版官方入口及网页端登录方式,涵盖首页直达地址、账号登录流程与常见访问问题说明,帮助用户快速找到微博官网主页,实现便捷、安全的网页端登录与内容浏览体验。

194

2026.02.13

Flutter跨平台开发与状态管理实战
Flutter跨平台开发与状态管理实战

本专题围绕Flutter框架展开,系统讲解跨平台UI构建原理与状态管理方案。内容涵盖Widget生命周期、路由管理、Provider与Bloc状态管理模式、网络请求封装及性能优化技巧。通过实战项目演示,帮助开发者构建流畅、可维护的跨平台移动应用。

91

2026.02.13

TypeScript工程化开发与Vite构建优化实践
TypeScript工程化开发与Vite构建优化实践

本专题面向前端开发者,深入讲解 TypeScript 类型系统与大型项目结构设计方法,并结合 Vite 构建工具优化前端工程化流程。内容包括模块化设计、类型声明管理、代码分割、热更新原理以及构建性能调优。通过完整项目示例,帮助开发者提升代码可维护性与开发效率。

20

2026.02.13

Redis高可用架构与分布式缓存实战
Redis高可用架构与分布式缓存实战

本专题围绕 Redis 在高并发系统中的应用展开,系统讲解主从复制、哨兵机制、Cluster 集群模式及数据分片原理。内容涵盖缓存穿透与雪崩解决方案、分布式锁实现、热点数据优化及持久化策略。通过真实业务场景演示,帮助开发者构建高可用、可扩展的分布式缓存系统。

54

2026.02.13

c语言 数据类型
c语言 数据类型

本专题整合了c语言数据类型相关内容,阅读专题下面的文章了解更多详细内容。

29

2026.02.12

雨课堂网页版登录入口与使用指南_官方在线教学平台访问方法
雨课堂网页版登录入口与使用指南_官方在线教学平台访问方法

本专题系统整理雨课堂网页版官方入口及在线登录方式,涵盖账号登录流程、官方直连入口及平台访问方法说明,帮助师生用户快速进入雨课堂在线教学平台,实现便捷、高效的课程学习与教学管理体验。

15

2026.02.12

豆包AI网页版入口与智能创作指南_官方在线写作与图片生成使用方法
豆包AI网页版入口与智能创作指南_官方在线写作与图片生成使用方法

本专题汇总豆包AI官方网页版入口及在线使用方式,涵盖智能写作工具、图片生成体验入口和官网登录方法,帮助用户快速直达豆包AI平台,高效完成文本创作与AI生图任务,实现便捷智能创作体验。

598

2026.02.12

PostgreSQL性能优化与索引调优实战
PostgreSQL性能优化与索引调优实战

本专题面向后端开发与数据库工程师,深入讲解 PostgreSQL 查询优化原理与索引机制。内容包括执行计划分析、常见索引类型对比、慢查询优化策略、事务隔离级别以及高并发场景下的性能调优技巧。通过实战案例解析,帮助开发者提升数据库响应速度与系统稳定性。

56

2026.02.12

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
Django DRF 源码解析
Django DRF 源码解析

共21课时 | 1.5万人学习

PHP8,究竟有啥野心..!?
PHP8,究竟有啥野心..!?

共4课时 | 0.6万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号