在做一个关于新闻的评论功能的H5页面时，需求里面要求能够发送表情显示表情，如果使用自定义的表情库，则在评论也还要加载大量的表情符图片，极大的影响加载速度，消耗流量，去看了下别的新闻网页版的评论部分也没有使用外带的表情库。
在input输入框里面添加上键盘自带表情符后，发送给后台服务器会显示服务异常，上网找了下解决办法，表情编码是16进制的，而我们用的是8进制的于是报错。将表情符转码成就能够ok。代码如下：
function utf16toEntities(str) {
var patt=/[\ud800-\udbff][\udc00-\udfff]/g;
// 检测utf16字符正则
str = str.replace(patt, function(char){
var H, L, code;
if (char.length===2) {
H = char.charCodeAt(0);
// 取出高位
L = char.charCodeAt(1);
// 取出低位
code = (H - 0xD800) * 0x400 + 0x10000 + L - 0xDC00;
// 转换算法
return "&#" + code + ";";
} else {
return char;
}
});
return str;
}
这样就解决了存储问题。
要想成功展示表情符还得转回来。不幸的是搜索到的解决方案里面只有上面一段转码的代码，只能自己动手。于是就照着这个进行了反转
//表情解码
function entitiestoUtf16(str){
// 检测出形如〹形式的字符串
var strObj=utf16toEntities(str);
var patt = /&#\d+;/g;
var H,L,code;
var arr = strObj.match(patt)||[];
for (var i=0;i<arr.length;i++){
code = arr[i];
code=code.replace(‘&#‘,‘‘).replace(‘;‘,‘‘);
// 高位
H = Math.floor((code-0x10000) / 0x400)+0xD800;
// 低位
L = (code - 0x10000) % 0x400 + 0xDC00;
code = "&#"+code+";";
var s = String.fromCharCode(H,L);
strObj.replace(code,s);
}
return strObj;
}
这样评论里就能显示键盘自带表情符啦。。
感谢后端师兄给予的帮助，同时希望能给需要的人帮助。如有错误之处，请指正~~~
H5页面input输入框含有键盘自带的表情符时显示异常
原文：http://www.cnblogs.com/yaliu/p/5190625.html
