Javascript 验证每个框元素是否仅包含一项

我几乎接近我想要完成的目标。现在，下面的代码示例检查框中是否有li标记。到目前为止，它还可以工作，但如果其中任何一个框中有li标记，它也会阻止其他框的拖放功能。但是，当拖动的框返回到其以前的状态时，其他框可以再次拖动到框中。我想做的是：

它应该能够选中带有li标记的单个框

如果任何框具有li标记，则它不应阻止其他框的功能。相反，它应该选中带有li标记的单个框

我不确定是否可以在不为每个li标记声明新id或类的情况下使其工作，而是希望使其按原样工作。任何方式，以便我可以遍历li标记并利用以下条件：

if ($('ul#sortable2 li').length > 1) { //This condition blocks drag and drop feature of other boxes if match found
    $(this).sortable("cancel");
}

N.B：对于箱子的每个部分，一次不能调整箱子中的两个项目

$（函数（）{
$（“#可排序1，#可排序2”）。可排序({
connectWith:“.connectedSortable”，
停止：功能（事件、用户界面）{
if（$（'ul#sortable2li'）.length>1）{//检查li标记是否存在
$（此）。可排序（“取消”）；
}
},
}).disableSelection（）；
});
#可排序1，#可排序2{
边框：1px实心#eee；
宽度：142px；
最小高度：20px；
列表样式类型：无；
保证金：0；
填充：5px0；
浮动：左；
右边距：10px；
}
#可排序1 li，#可排序2 li{
利润率：0 15px 15px 15px；
填充物：5px；
字体大小：1.2米；
宽度：120px；
}
#可排序1 ul li{
显示：块；
文本对齐：居中；
浮动：左；
}
#可排序2 ul li{
显示：块；
文本对齐：居中；
浮动：左；
}


第1项




第2项




第3项




第4项




第5项













您有重复的ID。这是第一个问题，因为ID必须是唯一的。我用一个类更改了ID

要引用当前代码，请更改代码：

if ($('ul#sortable2 li').length > 1) { //Checks if a li tag exists

致：

工作代码段：


$（“.sortable1.sortable2”）.sortable({
connectWith:“.connectedSortable”，
停止：功能（事件、用户界面）{
if（$（ui.item）.closest（'ul'）.find（'li'）.length>1）{//检查li标记是否存在
$（此）。可排序（“取消”）；
}
}
}).disableSelection（）
.sortable1、.sortable2{
边框：1px实心#eee；
宽度：142px；
最小高度：20px；
列表样式类型：无；
保证金：0；
填充：5px0；
浮动：左；
右边距：10px；
}
.可排序1 li.可排序2 li{
利润率：0 15px 15px 15px；
填充物：5px；
字体大小：1.2米；
宽度：120px；
}
.可悲的1 ul li{
显示：块；
文本对齐：居中；
浮动：左；
}
.可悲的2 ul li{
显示：块；
文本对齐：居中；
浮动：左；
}


第1项




第2项




第3项




第4项




第5项













恰到好处@gaetanoM。这似乎是一个工作的一个，让我测试它在我的最后，将通知你-谢谢很多。
if ($(ui.item).closest('ul').find('li').length > 1) { //Checks if a li tag exists