Javascript 如何使用jquery在拖动时克隆多个项目？

我有两个div，一个是main，另一个在jqueryui模式/弹出窗口中，它将jqueryui拖拽应用于多项目选择。我想做的是，点击并拖动它，创建一个克隆，它保存在DOM中，在被删除时不会被删除，也就是说，克隆选定的项目

$(function() {

    var selectedClass = 'ui-state-highlight',
        clickDelay = 600, lastClick, diffClick; // timestamps

    $("#draggable li")
    .bind('mousedown mouseup', function(e) {
        if (e.type == "mousedown") {
            lastClick = e.timeStamp; // get mousedown time
        } else {
            diffClick = e.timeStamp - lastClick;
            if (diffClick < clickDelay) {
                $(this).toggleClass(selectedClass);
            }
        }
    })
    .draggable({
        revertDuration: 10,
        containment: '.demo',
        start: function(e, ui) {
            ui.helper.addClass(selectedClass);
        },
        stop: function(e, ui) {
            $('.' + selectedClass).css({
                top: 0,
                left: 0
            });
        },
        drag: function(e, ui) {
            $('.' + selectedClass).css({
                top: ui.position.top,
                left: ui.position.left
            });
        }
    });

    $("#droppable, #draggable").sortable().droppable({
        drop: function(e, ui) {
            $('.' + selectedClass).appendTo($(this)).add(ui.draggable)
            .removeClass(selectedClass).css({
                top: 0,
                left: 0
            });
        }
    });

});

---

有什么解决方案或建议吗？

请参考。我想这是一个重复的问题。可能是，但我没能完成。你能帮我一下吗？请参考这是一个重复的问题，我想。可能是，但我没能完成。你能帮我一下吗

$("#droppable, #draggable").sortable().droppable({
        drop: function(e, ui) {
            $('.' + selectedClass).clone().appendTo($(this)).add(ui.draggable)
            .removeClass(selectedClass).css({
                top: 0,
                left: 0
            });
        }
    });