javascript - 一个元素可以代表另一个元素接受可排序的 droppable 吗？

Question

我有两个连接的可排序列表，但每个列表都在一个更大的块元素中。就像是：

<div class="items_box">
    <ul class="items">
        <li>Item</li>
        <li>Item</li>
        <li>Item</li>
    </ul>
</div>

<div class="items_box">
    <ul class="items">
        <li>Item</li>
        <li>Item</li>
        <li>Item</li>
    </ul>
</div>

使用这个 Javascript：

$(".items").sortable({connectWith: [".items"]});

.items_boxdiv 比列表高。我想让整个 div 代表其列表接受项目。我该怎么做？

Answer 1

解决方案是使容器可排序，并更改.items属性以在列表中查找您的项目。

$('.items_box').sortable({ 
  connectWith: '.items_box', 
  items: '> .items > li' 
});

我已经为您发布了一个工作示例（尽管拖入空列表存在问题，但这是一个新问题；）

另请注意，connectWith不再允许选择器数组。而是用逗号分隔它们。