javascript - 在 contenteditable 中的 2 个字母之间设置光标

Question

如何在下面的 a 和 b 之间设置光标？

<div contenteditable = true id = "test">
  abcdefg
</div>

我试过玩范围，但没有什么对我有用。下面的代码选择了整个文本，并且没有光标。（此代码适用于 Chrome）

sel =  window.getSelection();
range =  document.createRange();
node = document.getElementById("test");
range.setStart(node, 0);
range.setEnd(node, 1);
sel.addRange(range);

Answer 1

这应该有效：

function setSelectionRange(aNode, aOffset) {

    aNode.focus();

    var sel     = window.getSelection(),
        range   = sel.getRangeAt(0);

    range.collapse(true);
    range.setStart(aNode.childNodes[0], aOffset),

    sel.removeAllRanges();
    sel.addRange(range);
}

setSelectionRange(document.getElementById("test"), 1);

http://jsfiddle.net/5a9uD/1/

如果您查看 MDN 文档https://developer.mozilla.org/en-US/docs/Web/API/range.setStart，您将看到此接口使用节点而不是元素。