Jquery ui jQuery UI可拖动克隆

我有一个物品清单，可以拖到一些箱子上。我在列表项中添加了一个关闭按钮。“关闭”按钮适用于原始列表项，但不适用于克隆

$（“.sortable”）.sortable({
回复：对，
连接到：“.draggable”
});
$（“.draggable”）.draggable({
connectToSortable:“.sortable”，
助手：“克隆”，
回复：“真”，
占位符：“可拖放占位符”
});
$（“.sortable”）.draggable({
连接到：“.draggable”
});
$（“ul，li”）.disableSelection（）；
$（“.close列表项”）。单击（函数（事件）{
event.preventDefault（）；
log（“关闭被调用的列表项”）；
$（this）.最近（'li'）.remove（）；
});
ul{
列表样式类型：无；
保证金：0；
填充：0；
边缘底部：0.7em；
浮动：左；
}
李{
边缘：0.5em；
填充：0.5em；
宽度：200px；
边框：1px纯黑；
}
.可拖动柱{
身高：100%；
}
.可拖放项目{
边框：1px纯黑；
填充：0.5em；
浮动：左；
对齐内容：之间的空间；
}
.可排序{
宽度：230px；
高度：10公分；
溢出：自动；
边框：1px纯黑；
背景颜色：浅灰色；
}
.Dropable占位符{
背景颜色：黄色；
}
.行{
显示器：flex；
/*孩子们的身高相等*/
}
上校{
弹性：1；
/*此外，宽度相等*/
填充：1em；
边框：实心；
}


1将我拖到项目上

2将我拖到项目上

3将我拖到项目上

4将我拖到物品上

5将我拖到物品上


项目1


项目2


项目3


项目4


项目5


项目6


由于删除的
li
元素（及其内部的关闭按钮）是动态生成的，因此需要使用以下语法将事件绑定到该元素。您使用的语法不会将事件绑定到动态创建的元素。
参考文献：


$（“.sortable”）.sortable({
回复：对，
连接到：“.draggable”
});
$（“.draggable”）.draggable({
connectToSortable:“.sortable”，
助手：“克隆”，
回复：“真”，
占位符：“可拖放占位符”
});
$（“.sortable”）.draggable({
连接到：“.draggable”
});
$（“ul，li”）.disableSelection（）；
//请参见下一行中的更改
$（“.draggable column、.dropable column”）。在（“单击”，“关闭列表项”，函数（事件）{
event.preventDefault（）；
log（“关闭被调用的列表项”）；
$（this）.最近（'li'）.remove（）；
});
ul{
列表样式类型：无；
保证金：0；
填充：0；
边缘底部：0.7em；
浮动：左；
}
李{
边缘：0.5em；
填充：0.5em；
宽度：200px；
边框：1px纯黑；
}
.可拖动柱{
身高：100%；
}
.可拖放项目{
边框：1px纯黑；
填充：0.5em；
浮动：左；
对齐内容：之间的空间；
}
.可排序{
宽度：230px；
高度：10公分；
溢出：自动；
边框：1px纯黑；
背景颜色：浅灰色；
}
.Dropable占位符{
背景颜色：黄色；
}
.行{
显示器：flex；
/*孩子们的身高相等*/
}
上校{
弹性：1；
/*此外，宽度相等*/
填充：1em；
边框：实心；
}


1将我拖到项目上

2将我拖到项目上

3将我拖到项目上

4将我拖到物品上

5将我拖到物品上


项目1


项目2


项目3


项目4


项目5


项目6


由于删除的
li
元素（及其内部的关闭按钮）是动态生成的，因此需要使用以下语法将事件绑定到该元素。您使用的语法不会将事件绑定到动态创建的元素。
参考文献：


$（“.sortable”）.sortable({
回复：对，
连接到：“.draggable”
});
$（“.draggable”）.draggable({
connectToSortable:“.sortable”，
助手：“克隆”，
回复：“真”，
占位符：“可拖放占位符”
});
$（“.sortable”）.draggable({
连接到：“.draggable”
});
$（“ul，li”）。禁用选择i