在contenteditable元素中放置插入符号内的插入符号

Question

我正在开发文本编辑器。我有一个内容可编辑<div>，其中将要放置<span>元素与实际样式属性。 现在，我知道如何在这些span元素内放置插入符号，但是一旦我开始键入，文本就会在div的外部打印，在div本身内部打印。

下面是插入符号放置相关代码：

var rs = $("#textEntry").insert("span").set("style" , style); 

      sel = window.getSelection(); 

      sel.collapse(rs[ 0 ] , 0); 

      rs[ 0 ].focus(); 

哪里rs[ 0 ]是当前span元素。

我该如何克服这种行为？

P.S. $不是jQuery。

Answer 1

玩这个之后，似乎解决方案如下：

有必要添加一些内部文本，然后设置元素的第一个孩子，这是文本节点插入符号，然后取出文本。脱字符将留在该位置，瞧！有用。

var rs = $("#textEntry").insert("span").set("style" , style).html("a"); 

rs[ 0 ].focus(); 
if (document.selection) { 
    sel = document.selection.createRange(); 
    sel.moveStart('character' , 0); 
    sel.select(); 
} 
else{ 
    sel = window.getSelection(); 
    sel.collapse(rs[ 0 ].firstChild , 0); 
} 

rs.html("" , true); 

我很高兴看到其他解决方案，伙计们！