javascript - 在 contenteditable div 中插入 html 标签并在其中设置光标

Question

我有以下 Javascript 代码，它可以在 FireFox 中正确运行，但在 Google Chrome 中却不能。这个函数在可编辑的 DIV 中插入 html 标签，它应该保持光标在其中，以便用户可以看到具有应用于 SPAN 和类的样式的文本。以下代码适用于 FF 但不适用于 Chrome

function insertTextAtCursor(text, myid) { 

    if(myid != "")
    {
        var span = document.createElement('span');
        span.setAttribute('class', 'mystyle');
        var selection = window.getSelection();
        var range = selection.getRangeAt(0);        
        span.innerHTML=text;
         
        range.deleteContents();        
        range.insertNode(span); 
        
        range.setStart(span, 0);
        range.setEnd(span, 0);

        var selection = window.getSelection();
        selection.removeAllRanges();
        selection.addRange(range);
    
    }
   
}

谷歌浏览器需要进行任何更改才能正常工作吗？提前致谢。

标签： javascriptrangecontenteditable