获取光标位置并在光标位置插入表情

Li_Mao2 2017-02-06 11:30:27

像这样一个可编辑的div，怎么获取光标位置并在光标位置插入表情，我的每个表情占25位

<p>
<img src="images/19.png" width="30" height="28" onClick="dj1()" style="cursor:pointer">
<img src="images/20.png" width="30" height="28" onClick="dj2()" style="cursor:pointer">
</p>
<div id="bj" name="bj" style="width:98%; height:130px; border:1px solid blue" contenteditable="true"></div>

function phoneNumber() {
// $("#bj").append("<img src='images/53.png'/>"); 只能追加在最后
var nums = window.getSelection().getRangeAt(0).startOffset; //遇到图片就重新计数了，怎么解决？？？
var info = $("#bj").text();
var info1 = info.substring(0,nums);
var info2 = info.substring(nums,info.length);
info1 = info1 + "<img src='images/53.png'/>";
var info4 = info1 + info2;
alert(info4);
}

...全文

340 3 打赏收藏转发到动态举报

写回复

用AI写文章

3 条回复

切换为时间正序

请发表友善的回复…

发表回复

文修 2017-02-06

打赏
举报

楼主你好，我之前获取光标的位置写了一个函数，你可以参考一下

function getCursortPosition (ctrl) {
    var CaretPos = 0;   // IE Support
    if (document.selection) {
    ctrl.focus ();
        var Sel = document.selection.createRange ();
        Sel.moveStart ('character', -ctrl.value.length);
        CaretPos = Sel.text.length;
    }
    // Firefox support
    else if (ctrl.selectionStart || ctrl.selectionStart == '0')
        CaretPos = ctrl.selectionStart;
    return (CaretPos);
}

Li_Mao2 2017-02-06