js實現IM 表情解析

聊天記錄裡面，一般存放著表情代碼，顯示的是表情圖片。。。。。實現效果

這個，需要寫個Regex，將textarea裡面的用中括弧（【】）括起來的部分替換為相應圖片就行了

源碼如下：

// dml@2012.9.10 emotion parsevar em = [          {'id':1,'phrase':'[呵呵]','url':'1.gif'},{'id':2,'phrase':'[嘻嘻]','url':'2.gif'},          {'id':3,'phrase':'[哈哈]','url':'3.gif'},{'id':4,'phrase':'[可愛]','url':'4.gif'},          {'id':5,'phrase':'[可憐]','url':'5.gif'},{'id':6,'phrase':'[挖鼻孔]','url':'6.gif'},          {'id':7,'phrase':'[吃驚]','url':'7.gif'},{'id':8,'phrase':'[害羞]','url':'8.gif'},          {'id':9,'phrase':'[擠眼]','url':'9.gif'},{'id':10,'phrase':'[閉嘴]','url':'10.gif'},          {'id':11,'phrase':'[鄙視]','url':'11.gif'},{'id':12,'phrase':'[愛你]','url':'12.gif'},          {'id':13,'phrase':'[流淚]','url':'13.gif'},{'id':14,'phrase':'[偷笑]','url':'14.gif'},          {'id':15,'phrase':'[親親]','url':'15.gif'},{'id':16,'phrase':'[生病]','url':'16.gif'},          {'id':17,'phrase':'[開心]','url':'17.gif'},{'id':18,'phrase':'[懶得理你]','url':'18.gif'},          {'id':19,'phrase':'[左哼哼]','url':'19.gif'},{'id':20,'phrase':'[右哼哼]','url':'20.gif'},          {'id':21,'phrase':'[噓]','url':'21.gif'},{'id':22,'phrase':'[衰]','url':'22.gif'},          {'id':23,'phrase':'[委屈]','url':'23.gif'},{'id':24,'phrase':'[吐]','url':'24.gif'},          {'id':25,'phrase':'[打哈欠]','url':'25.gif'},{'id':26,'phrase':'[抱抱]','url':'26.gif'},          {'id':27,'phrase':'[怒]','url':'27.gif'},{'id':28,'phrase':'[疑問]','url':'28.gif'},          {'id':29,'phrase':'[饞嘴]','url':'29.gif'},{'id':30,'phrase':'[拜拜]','url':'30.gif'},          {'id':31,'phrase':'[思考]','url':'31.gif'},{'id':32,'phrase':'[汗]','url':'32.gif'},          {'id':33,'phrase':'[困]','url':'33.gif'},{'id':34,'phrase':'[睡覺]','url':'34.gif'},          {'id':35,'phrase':'[錢]','url':'35.gif'},{'id':36,'phrase':'[失望]','url':'36.gif'},          {'id':37,'phrase':'[酷]','url':'37.gif'},{'id':38,'phrase':'[花心]','url':'38.gif'},          {'id':39,'phrase':'[哼]','url':'39.gif'},{'id':40,'phrase':'[鼓掌]','url':'40.gif'},          {'id':41,'phrase':'[暈]','url':'41.gif'},{'id':42,'phrase':'[悲傷]','url':'42.gif'},          {'id':43,'phrase':'[抓狂]','url':'43.gif'},{'id':44,'phrase':'[黑線]','url':'44.gif'},          {'id':45,'phrase':'[陰臉]','url':'45.gif'},{'id':46,'phrase':'[怒罵]','url':'46.gif'},          {'id':47,'phrase':'[心]','url':'47.gif'},{'id':48,'phrase':'[傷心]','url':'48.gif'},          {'id':49,'phrase':'[豬頭]','url':'49.gif'},{'id':50,'phrase':'[OK]','url':'50.gif'},          {'id':51,'phrase':'[耶]','url':'51.gif'},{'id':52,'phrase':'[good]','url':'52.gif'},          {'id':53,'phrase':'[不要]','url':'53.gif'},{'id':54,'phrase':'[贊]','url':'54.gif'},          {'id':55,'phrase':'[來]','url':'55.gif'},{'id':56,'phrase':'[弱]','url':'56.gif'},          {'id':57,'phrase':'[蠟燭]','url':'57.gif'},{'id':58,'phrase':'[鐘]','url':'58.gif'},          {'id':59,'phrase':'[蛋糕]','url':'59.gif'},{'id':60,'phrase':'[話筒]','url':'60.gif'}      ];function MsgReplace(msgHTML) {var regx = /(\[[\u4e00-\u9fa5]*\w*\]){1}/g;// 正則尋找“[]”格式var rs = msgHTML.match(regx);if (rs) {for (i = 0; i < rs.length; i++) { for (n = 0; n < em.length; n++) {if (em[n].phrase == rs[i]) {var t = "<img src='images/emotions/" + em[n].url + "' />";msgHTML = msgHTML.replace(rs[i], t);break;}}}}return msgHTML;}

顯示地區，只需調用MsgReplace方法即可。。。。