Javascript将插入符号移动到contenteditable中的搜索字符串

我有一个contenteditable div，我需要将插入符号移动到字符串的位置，但我就是不知道怎么做。有人有什么建议吗

<div id='mydiv' contenteditable='true'>Lorem ipsum dolor sit amet, consectetur adipiscing elit.
    Sed eget libero sit <mark>amet</mark> and **peekabo** magna sagittis sagittis quis nec risus.
    Pellentesque feugiat pharetra purus id pharetra.
</div>

<script>
doFindStringAndMoveCaret('mydiv', 'peekabo');


function doFindStringAndMoveCaret(elem, searchFor) { 
    // Find searchFor string in the elem.innerHTML, and then move the 
    // cursor to the beginning of that text

    ??
}

理想情况下，纯旧javascript而不是jQuery

谢谢 阿贝

试试这个 还是这个

函数doFindStringAndMoveCaretelem，文本{ 函数setCurrentCursorPositionelement，字符{ 元素焦点 如果字符数>=0{ var selection=window.getSelection； range=createRangeelement.parentNode{ 计数：chars }; 中频范围{ range.collapsefalse； selection.removeAllRanges； selection.addRange范围； } } 函数createRangenode，字符，范围{ 如果！射程{ 范围=document.createRange range.selectNodenode； range.setStartnode，0； } 如果chars.count==0{ range.setEndnode，chars.count； }如果节点和字符数>0，则为else{ 如果node.nodeType===node.TEXT\u节点{ 如果node.textContent.length好的，我想我终于做到了

function doFindStringAndMoveCaret(editor, findTx) {
        treeObject = {}
        var element = editor;
        editor.focus();

        function doTreeWalk(element, object) {
            var nodeList = element.childNodes;
            if (nodeList != null) {
                if (nodeList.length) {
                    object[element.nodeName] = []; 

                    for (var i = 0; i < nodeList.length; i++) {

                        if (nodeList[i].nodeType == 3) {
                            var p=nodeList[i].nodeValue.indexOf(findTx);
                            if ( p!=-1 ) {
                                var sel=window.getSelection();
                                var range=sel.getRangeAt(0);
                                range.setStart(nodeList[i], p);
                                range.setEnd(nodeList[i], p+findTx.length);
                                return;
                            }
                        }
                        else {
                            object[element.nodeName].push({});
                            doTreeWalk(nodeList[i]
                            , object[element.nodeName][object[element.nodeName].length - 1]);
                        }
                    }
                }
            }
        }

        doTreeWalk(element, treeObject);
        return;
    }
    doFindStringAndMoveCaret(document.getElementById('mydiv'), 'peekabo');

可以在上找到一个工作示例

谢谢你

问候

---

Abe

这是否回答了你的问题？建议将插入符号位置设置为编码范围，但我无法连接的是在范围旁边搜索/行走的节点。div必须是contentEditable才能移动其中的插入符号。抱歉-我在帖子中的错误-它是contentEditable我现在更新了样本询问者希望将其移动到contentEditable中的某个字符串，没有结束。文本选择将无法工作，如果没有它被定义在某处。感谢GalaxyCat105，这是伟大的。。。但在返回的html上测试时，会有一点变化，返回的html位置错误。@user1432181您需要将p元素传递到函数中，而不是mydiv。如果我删除了p@user1432181，它就会工作。实际上，即使我传入了p元素，它也不会工作。我很快就会找到解决办法。

textSelect(document.getElementById(elem), 1);

function doFindStringAndMoveCaret(editor, findTx) {
        treeObject = {}
        var element = editor;
        editor.focus();

        function doTreeWalk(element, object) {
            var nodeList = element.childNodes;
            if (nodeList != null) {
                if (nodeList.length) {
                    object[element.nodeName] = []; 

                    for (var i = 0; i < nodeList.length; i++) {

                        if (nodeList[i].nodeType == 3) {
                            var p=nodeList[i].nodeValue.indexOf(findTx);
                            if ( p!=-1 ) {
                                var sel=window.getSelection();
                                var range=sel.getRangeAt(0);
                                range.setStart(nodeList[i], p);
                                range.setEnd(nodeList[i], p+findTx.length);
                                return;
                            }
                        }
                        else {
                            object[element.nodeName].push({});
                            doTreeWalk(nodeList[i]
                            , object[element.nodeName][object[element.nodeName].length - 1]);
                        }
                    }
                }
            }
        }

        doTreeWalk(element, treeObject);
        return;
    }
    doFindStringAndMoveCaret(document.getElementById('mydiv'), 'peekabo');