jquery如何实现添加表情到textaarea

首先textarea是纯文本编辑，是无法实现图片类表情的。字符类表情是ok的，直接输入相应字符即可。

然后，如果想实现图片类表情，需要使用富文本编辑器，你可以了解下fck之类的编辑器。

自己实现也可以，有一定的技术复杂度。

函数grin实现点击某个表情图标，就可以将表情图标翻译成代码并插入到指定的textarea中的鼠标光标停留位置。

具体实现方法：

var myField

if (...) {

myField = document.getElementById(tagname)

}else {

return false

}

定义一个局部变量myField，并指向指定的textarea，如果不存在指定的textarea则退出。

if (document.selection) {

myField.focus()

sel = document.selection.createRange()

sel.text = tag

myField.focus()

}

判断是否存在document.selection对象，主要是因为浏览器之间的差异，IE支持document.selection，FF不支持，所以要先判断一下。如果存在，则：

1、焦点转到指定的textarea

2、调用selection对象的createRange方法，该方法可以返回处于激活状态的输入框中选中的文本，如果没有选中任何文本，则自动定位到光标位置，并返回空字符串。表述的可能不太准确，可以搜索一下。

3、将选定的文本替换成表情对象对应的代码，如果没有选中文本，则将表情代码插入到光标位置。

4、焦点转到textarea。

else if (myField.selectionStart || myField.selectionStart == '0') {

var startPos = myField.selectionStart

var endPos = myField.selectionEnd

var cursorPos = endPos

myField.value = myField.value.substring(0,startPos)

+ tag

+ myField.value.substring(endPos, myField.value.length)

cursorPos += tag.length

myField.focus()

myField.selectionStart = cursorPos

myField.selectionEnd = cursorPos

}

如果浏览器不支持selection，则使用selectionStart和selectionEnd对象，从字面可以理解这两个对象是表示选中文本在输入框所有字符串中的起始位置和结束位置，调用subString方法以这两个位置分割输入框中的全部字符串为3个字符串，然后将选中的文本（即中间的字符串，如果没有选中文本则中间的字符串为空）替换成表情代码，最后把光标定位到表情代码的末尾，并且取消选中。

else {

myField.value += tag

myField.focus()

}

如果浏览器以上两种方法都不支持，则直接把表情代码添加到textarea中所有文本的末尾。

大概就是这么个意思吧。写的好累，楼主别忘了给分哦。

---