javascript - 给定一个 contentEditable Div 如何将光标设置到特定位置？

Question

给定一个 contentEditable div，如下所示:

<div contenteditable="true">Here is some text, hello world.</div>

如何将光标设置在第 6 个位置，紧跟在 is 中的 s 之后？

我一直在尝试使用:

savedRange = window.getSelection().getRangeAt(0);

然后像这样修改值:

savedRange.startOffset = 6
savedRange.endOffset = 6

但这并没有更新 savedRange。

关于如何在 div 中获取光标/插入符号的任何想法？谢谢

Answer 1

这是第 7 位。无论如何，假设您提供可编辑的 <div>。 “myDiv”的 id。请注意，这在 IE < 9 中不起作用，它具有完全不同的范围和选择 API。

if (window.getSelection) {
    var sel = window.getSelection();
    var textNode = document.getElementById("myDiv").firstChild;
    var range = document.createRange();
    range.setStart(textNode, 7);
    range.collapse(true);
    sel.removeAllRanges();
    sel.addRange(range);
}