如何从光标位置之前的contenteditable div中获取文本

Question

如何从光标位置之前的contenteditable div中获取文本

4

有没有一种方法可以从contenteditable div的开头获取文本到光标位置。
例如：

<div id="editableDiv" contenteditable="true">
    the quick brown fox jumps over a lazy dog.
</div>

假设1：在单词“quick”后光标闪烁。查询该函数必须返回“the quick”。假设2：句子末尾有光标闪烁。查询该函数必须返回“the quick brown fox jumps over a lazy dog.”。

- Basavaraj Metri

也许这可以帮助你：---> http://stackoverflow.com/questions/17613431/jquery-get-the-cursor-position-after-click - Jai

也许这会有所帮助: https://dev59.com/8W865IYBdhLWcg3wIa7M - Alo Sarv

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Basavaraj Metri · Accepted Answer

以下是解决方案：

getTextFromHeadToCaret: function () {
            var element = document.getElementById("editableDiv");
            var caretOffset = 0;
            if (typeof window.getSelection != "undefined") {
                var range = window.getSelection().getRangeAt(0);
                var preCaretRange = range.cloneRange();
                preCaretRange.selectNodeContents(element);
                preCaretRange.setEnd(range.endContainer, range.endOffset);
                caretOffset = preCaretRange.toString().length;
            } else if (typeof document.selection != "undefined" && document.selection.type != "Control") {
                var textRange = document.selection.createRange();
                var preCaretTextRange = document.body.createTextRange();
                preCaretTextRange.moveToElementText(element);
                preCaretTextRange.setEndPoint("EndToEnd", textRange);
                caretOffset = preCaretTextRange.text.length;
            }
            var divStr = $('#editableDiv').text();
            return divStr.substring(0, caretOffset);
        }