Question

我有一个wysihtml富文本编辑器。如果满足某些条件，我想改变插入符号的偏移量。

因为wysithtml textarea不是真正的textarea div（它只是一个普通的div），所以我不能使用常见的textarea策略来移动插入符号。但经过一些实验，我发现将它视为Selection使我能够将其作为文本区域进行处理。

从我读到的更改插入符偏移量的正确方法是Range.setStart()，但我无法弄清楚如何使用它。谁可以帮助我？

我已设置this jsfiddle。尝试（在Firefox中）将插入符移动到偏移27.然后编辑器的值将改变，插入符将移动到偏移0.但是如何将插入符移动到例如0。抵消35？

Answer 1

我已将您的fiddle更新为您想要的工作。
这是我修改过的部分：

if (offsets.start_offset == 27) {
    editor.setValue("This is first line.<br>This is another second line.", true);

   /* START OF MODIFICATION */

      var range = window.getSelection().getRangeAt(0);
      range.selectNodeContents(textarea);

        var fromPos = 27;
        var lenTotal = ( textarea.textContent || textarea.innerText ).length;
        var lenCurTextNode = range.endContainer.lastChild.nodeValue.length;
        var lenNewWord= 'another '.length ;

        var newPos = ( fromPos - (lenTotal - lenCurTextNode) ) + lenNewWord;


      range.setStart(range.startContainer.lastChild , newPos);
      range.setEnd(range.endContainer.lastChild , newPos);

  /* END OF MODIFICATION */

      var offsets = getOffsets(textarea);
    console.log("I want offsets.start_offset to be 35, but it is " + offsets.start_offset)
  } else {
    console.log("Offset is from " + offsets.start_offset + " to " + offsets.end_offset );
  }

你必须处理textNode来创建一系列文本字符而不是HTMLElement。就是这样，你的Range.setStart()没有任何影响，它是＆＃39;范围＆＃39; divs！

在您的示例中，textarea是一个div，您需要在其中找到每个textNode并与之交互在上面的代码中，range.endContainer.lastChild是textNode （实际上是textarea的lastChild）。

希望这会对你有帮助！

使用Firefox测试

如何在富文本编辑器textarea中更改插入符偏移量？

1 个答案: