基于jQuery实现的QQ表情插件

当选择表情图片后，输入框中会插入一段如[em_5]之类的代码，代表插入的表情图片，实际应用中，点提交按钮后应该将这段表情代码连同其他内容插入到数据表中。而在页面显示的时候，我们应该将表情代码替换成真正的图片显示在页面上。下面的代码是插入表情图片后，点击提交按钮，使用javascript自定义函数将表情代码替换并显示：

$(function(){
 ...
 $(".sub_btn").click(function(){
  var str = $("#saytext").val();
  $("#show").html(replace_em(str));
 });
});
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="face/$1.gif" border="0" />');
 return str;
} 

如果您想用PHP代码来正则替换表情图片的话，可以使用以下函数：

function ubbReplace($str){
 $str = str_replace(">",'<；',$str);
 $str = str_replace(">",'>；',$str);
 $str = str_replace("n",'>；br/>；',$str);
 $str = preg_replace("[[em_([0-9]*)]]",">img src="face/$1.gif" />",$str);
 return $str;
}

以上内容就是本文对基于jQuery实现的QQ表情插件的详细介绍，希望大家喜欢。