如何从开始到光标位置从contenteditable div获取文本

Question

有没有一种方法可以使文本contenteditable div从开始到光标位置。
例如：

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

假设1：光标在单词quick之后闪烁。对函数的查询必须返回快速

假设2：光标在句子的末尾闪烁。该函数的查询必须返回快速的棕色狐狸跳过一条懒狗。

Answer 1

这是解决方案

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);
        }