0

我有以下功能可以跟踪可编辑 div 中的光标位置：

  function getCaretPosition(editableDiv) {
        var caretPos = 0, containerEl = null, sel, range;
        if (window.getSelection) {
            sel = window.getSelection();
            if (sel.rangeCount) {
                range = sel.getRangeAt(0);
                if (range.commonAncestorContainer.parentNode == editableDiv) {
                    caretPos = range.endOffset;
                }
            }
        } else if (document.selection && document.selection.createRange) {
            range = document.selection.createRange();
            if (range.parentElement() == editableDiv) {
                var tempEl = document.createElement("span");
                editableDiv.insertBefore(tempEl, editableDiv.firstChild);
                var tempRange = range.duplicate();
                tempRange.moveToElementText(tempEl);
                tempRange.setEndPoint("EndToEnd", range);
                caretPos = tempRange.text.length;
            }
        }
        return caretPos-1;
    }

问题是，如果我的可编辑 div 具有以下 html：

hello <span contenteditable='false'>Abderrahmane Benbachir</span>

我把光标放在跨度旁边，它从0开始计数光标。这是为什么呢？我该如何解决？

4

1 回答 1

0

在这种情况下，要获得插入符号的位置，请改用这个Tim Down 的代码。它还具有restoreSelection恢复插入符号位置的功能。

我最近问了同样的问题，你可以在这里查看。

于 2013-05-17T07:29:10.243 回答