Javascript 拖放时显示位置和总数

jQuery UI可排序-处理空列表
#可排序1，
#可排序2，
#可排序的3{
列表样式类型：无；
保证金：0；
浮动：左；
右边距：10px；
背景：#eee；
填充物：5px；
宽度：143px；
}
#可悲的1李，
#可悲的2李，
#可排序的3李{
保证金：5px；
填充物：5px；
字体大小：1.2米；
宽度：120px；
}
$（函数（）{
$（“ul.droptrue”）。可排序({
与“ul”连接
});
$（“ul.dropfalse”）。可排序({
连接到：“ul”，
dropOnEmpty：错
});
$（“#可排序1，#可排序2，#可排序3”）.disableSelection（）；
});

工人1
工人2
工人3
工人4
工人5


工人6
工人7
工人8
工人9
工人10


工人11
工人12
工人13
工人14
工人15

若要执行所需操作，您可以将

ul

元素包装在

div

中，并在其下方放置另一个

div

，以保存该容器中

li

元素的总数。然后，您可以使用可排序插件的

stop

属性在删除项目时更新该

total

，如下所示：

$（“ul.droptrue”）.可排序({
连接到：“ul”，
停止：函数（）{
$（'.total'）.text（函数（）{
返回'Total:'+$（this）.closest（'.container'）.find（'li'）.length；
});
}
});
$（“ul.dropfalse”）。可排序({
连接到：“ul”，
dropOnEmpty：错
});
$（“#可排序1，#可排序2，#可排序3”）.disableSelection（）
.container{
显示：内联块；
}
#可排序1，
#可排序2，
#可排序的3{
列表样式类型：无；
保证金：0；
浮动：左；
右边距：10px；
背景：#eee；
填充物：5px；
宽度：143px；
}
#可悲的1李，
#可悲的2李，
#可排序的3李{
保证金：5px；
填充物：5px；
字体大小：0.8em；/*已更改，因此示例更适合代码段*/
宽度：120px；
}


工人1
工人2
工人3
工人4
工人5

总数：5

工人6
工人7
工人8
工人9
工人10

总数：5

工人11
工人12
工人13
工人14
工人15

总数：5
1）您尝试过什么？2） 您试图实现的布局没有意义。你能描述一下与每个
工人相关的数字是如何产生的吗？我只是一个例子，我试图在下一列中显示它们，如代码中所示。它是对在特定机器中工作的工人的职位进行分类。如果他们改变位置，我需要拖放。下一列将显示什么？再说一遍，这毫无意义。为什么第一列只有3项，第二列只有4项？其他8个工人呢？1个工人1个工人4个工人8个工人2个工人5个工人9个工人3个工人6个工人10个工人7个工人11个总数3个总数4个工人12个6个工人13个7个工人14个8个工人15个总数8所以现在要解决的最后一个问题是，为什么每列中有3/4/8项？得了吧，所有这些都应该是问题。如果你想让人们帮你提供所有的信息。