dart - 如何在contenteditable div(Dart)中设置和获得插入符号位置？

Question

如何在内容可编辑的div中设置并获得插入符号位置？

我对当contenteditable div位于web组件(带有阴影dom)内部时也可以使用的方法感兴趣。

Answer 1

以下代码似乎有效。如果您不使用Shadow dom，则可以使用:var root = window;
请注意，在当前的Dartium版本(2015年11月)中，存在一个错误，该错误会阻止getCaretPosition与shadow dom一起正常使用。在最新版本的chrome中编译为javascript后，它可以工作。

int getCaretPosition(Element element) {
  dynamic root = element.shadowRoot ?? window;
  return root.getSelection().getRangeAt(0).endOffset;
}

void setCaretPosition(Element element, int position) {
  final range = document.createRange()
    ..setStart(element, position)
    ..setEnd(element, position);

  dynamic root = element.shadowRoot ?? window;
  root.getSelection()
    ..removeAllRanges()
    ..addRange(range);
}

在Dartpad上查看演示