可编辑div 插入表情后，光标定位在文本末尾

最新推荐文章于 2022-04-21 15:30:09 发布

Fayneヾ

最新推荐文章于 2022-04-21 15:30:09 发布

阅读量1.9k

点赞数 2

本文链接：https://blog.csdn.net/weixin_42988734/article/details/81745878

版权

将可编辑div作为聊天输入框，插入表情时，光标始终在表情前面，于是在网上找了一些代码，现总结如下：
<div id="message_text" contenteditable="true"></div> 可编辑div

function Focus() {
   // 始终聚焦在文本末尾
    el=document.getElementById('message_text');
    //el=el[0];  //jquery 对象转dom对象
    el.focus();
    if($.support.msie){
        var range = document.selection.createRange();
        this.last = range;
        range.moveToElementText(el);
        range.select();
        document.selection.empty(); //取消选中
    } else {
        var range = document.createRange();
        range.selectNodeContents(el);
        range.collapse(false);
        var sel = window.getSelection();
        sel.removeAllRanges();
        sel.addRange(range);
    } 
}