jQuery Draggable ConnectTosortable可保持原始

Question

我有以下方案：我正在编写一个简单的MIDI工具，有2个列表，左侧的一个是可分类的，用于从右侧删除项目（左侧是要使用的注释列表，右边是注意我可以使用）。当我将笔记拖到左侧时，它将从右侧删除，因此我无法再次添加此注释。

我如何停止在掉落后删除原始元素？我试图在停止事件中克隆它，但是这在左侧创建了2个注释，并从右侧删除，我还尝试在开始事件中克隆物品，但是当掉落时，它将被删除。

我没有看到这种情况的任何示例，其中大多数是要添加可辍学的示例，但是我使用可分配的，这肯定是一样的吗？

这是我脚本的相关部分：

    $(".alloc").draggable(
        {
            connectToSortable: ".playList",
            helper: "clone",
            snap: true,
            refreshPositions: true,
            stack: ".notes",
            handle: ".note-head",
            start: function (_event, ui) {
                let li = ui.helper;
                li.clone().insertAfter(li);
            },
            stop: function (_event, ui) {
                let li = ui.helper;
                let ol = li.parent();
                li.removeClass("bank");
                li.addClass("note");
                let id = li.attr( "id");
                let value = li.attr( "data-value");
                let data = {
                    _token: $('#token').val(),
                    id: id,
                    value: value
                };
                $.post( "/note/add", data )
                    .done( function( result ) {
                        // Update if needed...
                    });

            }
        }
    );

    $(".playList").sortable(
        {
            connectWith: ".notes",
            placeholder: "ui-state-highlight h-full",
            distance: 4,
            helper: "clone",
            receive: function (_event, ui) {
                ui.item.remove();
            }
        }
    );

如何将正确的列表保留在可排序的左列表中？

谢谢

Answer 1

我从可分配中删除了ui.item.remove（）;，并根据需要起作用。