设计聊天室,遇到了一个自己无法解决问题,请大家看看,能否解决?.........等待中.........

本人现在用ajax技术模仿一人像QQ软件一样的聊天室,现有一个问题不知道如果下手解决如下:
<textarea id="content"></teaxarea>这个是发送时用的textarea.
想实现像QQ软件那样的,插入到textarea中的表情图片会马上显示.这个我可以实现如下:
var str=document.getElementById("content");
var oImg=document.createElement("IMG");
oImg.src="img/face/" + id + ".gif";
face="img/face/" + id + ".gif";
str.appendChild(oImg);
这样就可以了,但是问题虽之而来:
比如Textarea 中的内容如下:
你好吗?    如果在"你好吗?"后面插入一个表情,则表情顺利的插入到了"你好吗?"的后面了.
但是问题又业了,如果把鼠标放在"你"的后面再插入一个表情的时候,则表情图片不是插到"你"的后面,而是插入到了最后面了,请问这个问题应当怎么解决呢<?谢谢各位了.