pre标签在微信网页版输入框中神奇表现

图片说明
一开始啥都没有,一切正常,在输入123456789之后
图片说明
没任何问题,关键在点击了输入框的字符串,让光标出现在字符串中间的时候,pre和他外层的div全部都刷新了!然后效果是:
图片说明
看到了吗。注意我光标的位置以及红框,最后插入图片
图片说明
我的问题是在鼠标点击输入框类的字符串的时候,光标移动到指定的位置,做了什么操作,能让pre产生这么神奇的效果,我没有看到任何换行符或者其他东西,而且这时候你edit as HTML 看到的是
图片说明
不知道大伙有没有明白我的意思,我认为这是pre设置为可编辑状态后,能在光标指定位置插入表情图片的关键所在,
如果大伙有遇到类似的情况,都可以说说,包括光标位置的定位,以及复制粘贴方法如何重写已保证只有纯文本和表情图片能留下等等...
ps:我实在没有悬赏币,抱歉...

http://blog.csdn.net/singwhatiwanna/article/details/42215847

你的编辑器js控制的吧,微信内置浏览器就是webkit的,用谷歌测试鼠标放上去没有出现图2的情况

谷歌也有,我试过了,不过我已经发现关键是getSelection()了。

https://www.npmjs.com/package/v-chateditor
模仿网页版微信聊天输入框可输入*文本,表情,图片,文件,并且消息可根据类型切割发送。还可以发送*视频以及*语音消息。图片说明