巧用replace将文字表情替换为图片
更新时间：2014年04月17日 15:31:44 作者：
选择表情插入文本域的时候，显示的是类似[哈哈]这样的字符串，下面是把表情字符串转换为图片表情的一种方法
微博或者论坛上常见的效果，选择表情插入文本域的时候，显示的是类似[哈哈]这样的字符串，下面是把表情字符串转换为图片表情的一种方法
<div id="test">abc</div>
var face ={'[哈哈]':'<img src="images/face/haha.gif" alt="" />','[流汗]':'<img src="images/face/liuhan.gif" alt="" />'} //完整的qq表情见本文末尾
var reg = /\[.+?\]/g;
var str = '[哈哈]abc[流汗][流汗]'; //这里是获取到的文本域的value，简洁起见，直接使用了字符串。
str = str.replace(reg,function(a,b){
return face[a];
});
document.getElementById('test').innerHTML = str;
qq表情包及对应face对象：http://pan.baidu.com/s/1qWPQbBu
复制代码 代码如下:
<div id="test">abc</div>
复制代码 代码如下:
var face ={'[哈哈]':'<img src="images/face/haha.gif" alt="" />','[流汗]':'<img src="images/face/liuhan.gif" alt="" />'} //完整的qq表情见本文末尾
var reg = /\[.+?\]/g;
var str = '[哈哈]abc[流汗][流汗]'; //这里是获取到的文本域的value，简洁起见，直接使用了字符串。
str = str.replace(reg,function(a,b){
return face[a];
});
document.getElementById('test').innerHTML = str;
qq表情包及对应face对象：http://pan.baidu.com/s/1qWPQbBu
相关文章
这篇文章主要为大家详细介绍了JS实现页面跳转并传值，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2022-06-06
Javascript也是面向对象的语言，但它是一种基于原型Prototype的语言，而不是基于类的语言。接下来通过本文给大家介绍Javascript中的Prototype到底是啥的相关知识，感兴趣的朋友参考下2016-02-02
本文介绍JSON.stringify9大特性和转换规则,JSON.stringify()方法将一个JavaScript对象或值转换为 JSON 字符串,如果指定了一个replacer 函数,则可以选择性地替换值,或者指定的replacer是数组,则可选择性地仅包含数组指定的属性,更多内容需要的小火煸可以参考下面温行内容2022-02-02
试想一下你要在你的网站提供如下这样的功能：提供一个文本框用于收集用户数据，这个文本框只能接受整型的数值，不提供给用户手工输入，只提供两个按钮。2009-10-10
BootStrap 图片样式、辅助类样式和CSS组件的实例详解
这篇文章主要介绍了BootStrap 图片样式、辅助类样式和CSS组件的实现代码，图文并茂介绍的非常详细，需要的朋友参考下吧2017-01-01
这篇文章主要介绍了javascript实现点击后变换按钮显示文字的方法,可实现显示一些按钮如果点击了,按钮文本变为“点了”,其他按钮文本变为“没点”的效果,非常具有实用价值,需要的朋友可以参考下2015-05-05
身份证有效性验证的方法有很多，在本文将为大家介绍下如何使用js简单实现下，感兴趣的朋友可以参考下2013-10-10
Any Share 是一种简单、轻量、快速的文件共享服务。使用 Javascript 编写，并搭建在 Firebase 平台。本文将利用它实现创建文件共享型网站，感兴趣的可以了解一下2022-11-11
这篇文章主要介绍了微信小程序实现活动报名登记,本篇将介绍使用微信小程序实现发起一个活动报名的设计，以此为基础，我们可以掌握微信小程序表单的基本用法，进而在诸如疫情信息登记、出入报备等场景中使用小程序进行开发，满足相关的需求，需要的朋友可以参考下2022-09-09
这篇文章主要介绍了JavaScript实现网页版简易计算器功能，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2022-07-07
最新评论