Javascript 如何将插入符号设置为contenteditable中范围对象的最后一个字符？

我很难弄清楚如何根据范围对象中的最后一个字符设置插入符号位置

例如，我有contenteditable，它有一些文本

Hello world Test

然后我用鼠标突出显示文本的一部分（“wor”）：

然后mouseup事件将获得所选范围

焦点消失后，选定的高光将消失

现在，我的目标是将插入符号设置为“r”和“l”之间，如下图所示（范围的末尾）

到目前为止，我已经完成了选择和恢复部分的工作，但无法根据范围对象确定插入符号设置

代码：

var node = this.element.find(".reContentArea")[0];
var range = document.createRange();

var sel = window.getSelection();

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

---

您可以使用

focusOffset

获取选择结束时的字符位置：

$('.reContentArea').on('mouseup', function() {
    var offset= window.getSelection().focusOffset 
})

在设置

contenteditable元素上的插入符号位置时，我们可以使用。正如您在该方法中所看到的，我们需要指定节点和该节点内的偏移量

var editable = $('.reContentArea')[0],
    range = document.createRange(),
    sel = window.getSelection();    

range.setStart(editable.firstChild, offset);
range.collapse(true);
sel.removeAllRanges();
sel.addRange(range);

我甚至不清楚你想触发什么“设置插入符号”，但我用这个解决方案做了一个简单的点击事件。
我建议使用这个很棒的插件


请点击此处查看演示：

这对
和
元素有效，对吗？但不是在
contenteditable
元素上。哦，对不起，我没有注意到你的回答。不，我的意思是它对contenteditable元素不起作用，我也没有问这个问题。Andrew（jquery.caret的创建者）在他第一次开始这个项目时就和我联系过。在DOM中处理文本范围有很多复杂的问题，比如处理跨多个元素的选择、换行符、段落、CSS规则（特别是在IE上）。因此，如果插件目前无法正确处理，他就不会在插件中包含此功能，因为这可能会给这个很棒的插件带来缺点。干杯
// Select everything after the 6th character
$('input').range(6);
$('textarea').val('Hello\nWorld').range(6).range().text === 'World';