如何在内容中保持光标位置可编辑

时间:2020-09-14 02:33:26

标签: javascript html

我正在与contenteditable一起工作,在这种情况下,我将更新链接,并在用户键入文本时将其作为标签。

但是我失去了光标位置。

然后我实现了这段代码

 setEndOfContenteditable(contentEditableElement:any)
    {
        var range,selection;
        if(document.createRange)//Firefox, Chrome, Opera, Safari, IE 9+
        {
            range = document.createRange();//Create a range (a range is a like the selection but invisible)
            range.selectNodeContents(contentEditableElement);//Select the entire contents of the element with the range
            range.collapse(false);//collapse the range to the end point. false means collapse to end rather than the start
            selection = window.getSelection();//get the selection object (allows you to change selection)
            // @ts-ignore
            selection.removeAllRanges();//remove any selections already made
            // @ts-ignore
            selection.addRange(range);//make the range you have just created the visible selection
        }
        // @ts-ignore
        else if(document.selection)//IE 8 and lower
        {
            // @ts-ignore
            range = document.body.createTextRange();//Create a range (a range is a like the selection but invisible)
            range.moveToElementText(contentEditableElement);//Select the entire contents of the element with the range
            range.collapse(false);//collapse the range to the end point. false means collapse to end rather than the start
            range.select();//Select the range (make it the visible selection 
        }
    }

并且此代码将光标设置为可编辑的内容结尾,但是当有人开始在媒体中进行编辑时,此功能将无效。

所以在更新过程中如何保持光标在内容中的位置可编辑

0 个答案:

没有答案