Jquery 在contenteditable元素中选择Start和selectionEnd

我一直在努力使用textarea的selectionStart和selectionEnd属性，使它们能够与contenteditablediv元素一起工作。我查阅了很多关于谷歌等网站的相关文章，但都没有结果。我有一些类似于下面的东西，它非常适合textarea。但我想让这个和ContentDiv一起工作

function replaceVal(node, val, step){
    //...
    var cursorLoc =  node.selectionStart;
    node.value = node.value.substring(0, node.selectionStart - step) + value +
    node.value.substring(node.selectionEnd, node.value.length);
    node.scrollTop = scrollTop;
    node.selectionStart = cursorLoc + value.length - step;
    node.selectionEnd = cursorLoc + value.length - step;
  //...
}

---

如何对其进行修改，使其能够使用contenteditable div元素而不是textarea？

尝试此操作，它将返回所选文本，无论其是否为contenteditable

函数GetSelectedText（）{ if（document.getSelection）{//所有浏览器，版本9之前的IE除外 var sel=document.getSelection（）； //sel是Firefox和Opera中的字符串， //谷歌Chrome、Safari和IE版本9中的selectionRange对象 //alert方法显示传递对象的toString方法的结果 警报（sel）； } 否则{ 如果（document.selection）{//9版之前的Internet Explorer var textRange=document.selection.createRange（）； 警报（textRange.text）； } } }

测试示例Microsoft T恤盒
获取文本

此答案使用选择#修改，这是非标准的，但至少我建议您使用“insertText”命令：

function replaceVal（val，step）{
var selection=window.getSelection（）；
对于（变量i=0；i

可编辑：
测试
步骤：
获取文本

使用object from方法获取内容可编辑元素的

baseOffset

和

extendtoffset

var sel = document.getSelection();
node.value = node.value.slice(0, sel.baseOffset - step) + value + node.value.slice(sel.extentOffset);

---

获取：。设置：@TimDown我已经检查了链接，它们真的很有用。但我仍然遇到了一个问题，就是如何正确地将每个按下的键值附加到contentEditable。我已将node.value替换为node.childNodes[0].nodeValue，每个字符都会追加到div中。但是，当我按Enter键并开始键入时，字符会追加到前面的字符中，忽略Enter键（将替换为
）。如何使内容可编辑？如何理解HTML标记，如
和？@semytech您解决过HTML标记的问题吗？我也遇到过类似的问题，我找到了从选择创建文本范围的解决方案。在这种情况下，可以修改范围边界并重新选择内容。请访问以下问题：