在可内容编辑的 div 中的光标处附加 div [重复]答案

【问题标题】：Append div at cursor in a contenteditable div [duplicate]在可内容编辑的 div 中的光标处附加 div [重复]
【发布时间】：2013-07-25 07:21:28
【问题描述】：

我有一个内容可编辑的 div，我需要在插入符号位置附加 div(child)？

我使用堆栈中的一些示例成功地在插入符号位置添加了文本。但我没有找到在插入符号位置附加 div 的方法。

怎么做？

var appendText = "<div class='ui-state-default' contenteditable='false'>
<span>"+ui.draggable.text()+"</span>
<span class='ebAppendFieldClose'>x</span>
</div>"

$("#ebPlaceholder").append(appendText);

现在我使用正常的方法（像这样）。

【问题讨论】：

请向我们展示您当前的代码 :)

标签： javascript jquery dom contenteditable

【解决方案1】：

不确定您要做什么；是把 div 放在光标位置吗？

var appendText = "<div class='ui-state-default' contenteditable='false'><span>" + ui.draggable.text() + "</span><span class='ebAppendFieldClose'>x</span></div>"

//I'm using 'click', but it can be whatever you want
$("#ebPlaceholder").on('click', function(e) {
    appendText.css({position: 'absolute',
        top: e.clientY + 'px',
        left: e.clientX + 'px'
    }); 
    e.target.append(appendText);
});

【讨论】：