jquery可拖动connectToSortable保持原始

Question

我有以下场景:我正在编写一个简单的midi工具，我有两个列表，左边的一个是可排序的，用于从右边删除项目(左边是要使用的音符列表，右边是我可以使用的音符列表)。当我把我的注释拖到左边时，它会从右边移开，所以我不能再添加这个注释。

如何阻止原始元素在删除后被删除?我尝试在停止事件中克隆它，但这在左侧创建了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();，它按要求工作。