Question

我需要将文本插入到一个可信的div中，然后将光标放在插入文本的末尾。

我从这里Insert text at cursor in a content editable div获得了以下解决方案。

如果将文本添加到空div中，则效果很好。但如果用户已输入文本，则无效。或者，如果该函数用于插入文本，则用户将光标放在新内部文本内的某处，然后再次调用该函数。然后光标留在插入文本的开头。

编辑：以下代码适用于IE，正确设置光标，但Chrome中存在问题。

function insertTextAtCursor(text) {
    var sel, range, html;
    if (window.getSelection) {
        sel = window.getSelection();
        if (sel.getRangeAt && sel.rangeCount) {
            range = sel.getRangeAt(0);
            range.deleteContents();
            range.insertNode( document.createTextNode(text) );
        }
    } else if (document.selection && document.selection.createRange) {
        document.selection.createRange().text = text;
    }
}

Answer 1

好吧，一旦我意识到它是Chrome / IE的东西，我设法找到了我最初找到的答案中的一个评论中的答案。

function insertTextAtCursor(text) { 
    var sel, range, html; 
    sel = window.getSelection();
    range = sel.getRangeAt(0); 
    range.deleteContents(); 
    var textNode = document.createTextNode(text);
    range.insertNode(textNode);
    range.setStartAfter(textNode);
    sel.removeAllRanges();
    sel.addRange(range);        
}

js / jquery：contenteditable，插入文本并将光标移动到结尾

1 个答案: