javascript - 输入新行时如何获取插入符号在contentEditable div中的位置？

我正在使用UIWebview创建富文本编辑器，该编辑器使用了contentEditable div。我想以像素为单位插入符号的位置。我已经搜索了很多，下面得到了代码。

function getCaretClientPosition() {
  var x = 0, y = 0;
  var sel = window.getSelection();
  if (sel.rangeCount) {
    var range = sel.getRangeAt(0);
    if (range.getClientRects) {
      var rects = range.getClientRects();
      if (rects.length > 0) {
        x = rects[0].left;
        y = rects[0].top;
      }
    }
  }
  return { x: x, y: y };
}

上面的代码在输入换行符之前效果很好。 sel.getRangeAt(0)返回null，因此该函数无法返回正确的插入符号Y像素。

最佳答案

这是我用来通过插入临时对象并将其删除来获得插入符号最高位置的代码:

function getCaretTopPosition() {
    document.execCommand('insertHTML', false, '<span id="hidden"></span>');
    var hiddenNode = document.getElementById('hidden');
    if (!hiddenNode) {
        return 0;
    }
    var topPosition = hiddenNode.offsetTop;
    hiddenNode.parentNode.removeChild(hiddenNode);
    return topPosition;
}