技术饭

div设置contentEditable="true"作为文本编辑器,定位光标解决办法

copylian    0 评论    5913 浏览    2017.02.09

contentEditable|编辑器|定位光标,比如你会在div中插入表情,也可能输入文字,这时候,你可能需要定位光标的位置,默认不处理的情况下,div的光标是定位在文字后面,而你插入一个img标签,光标是不会跟随移动的!

/** 
* [set_focus 光标移到最后] 
* @param {[type]} el [description] 
*/
function set_focus(el){
    el=el[0];  // jquery 对象转dom对象
    //el.focus();
    if(/msie/.test(navigator.userAgent.toLowerCase())){
        var rng;
        el.focus();  		
        rng = document.selection.createRange();
        rng.moveStart('character', -el.innerText.length);  		
        var text = rng.text;  		
        for (var i = 0; i < el.innerText.length; i++) {
            if (el.innerText.substring(0, i + 1) == text.substring(text.length - i - 1, text.length)) {
                result = i + 1;
            }  		
        }
     }  else  { 
         var range = document.createRange();
         range.selectNodeContents(el);
         range.collapse(false);var sel = window.getSelection();sel.removeAllRanges();
         sel.addRange(range);
     }
}


飓风呀
感谢你的支持,我会继续努力!
扫码打赏,感谢您的支持!

文明上网理性发言!

  • 还没有评论,沙发等你来抢