拖动时显示插入符号，精确拖放到textarea或可编辑内容

Question

我有一个项目列表，我想将它们拖放到textarea或内容可编辑的div元素中。我想知道在拖动元素期间是否可以在文本中的每个字符之间显示插入符号。这与MS Word具有的效果相同：

在这个fiddle中，我可以拖动元素并放在textarea上，但最后添加了文本，但是我希望有一个活动的插入符来决定drop元素。

    $("#divFields li").draggable({
    helper: "clone"
});

$("#divDroppedFields").droppable({
    accept: "#divFields li",
    drop: function (event, ui) {
        var messageValue = $("#txtMessageFields").val();            
        messageValue = messageValue + ' #' + ui.draggable.text() + '! ';
        $(this).find('#txtMessageFields').val(messageValue);
    }
});   

Answer 1

有同样的挑战 - 我现在正在研究它。一个技巧（我现在正在测试）将用div替换文本区域，其中每个字母也是一个html节点。通过这种方式，您可以检测到哪个节点被丢弃。并将其插入并转换回来。