一个元素可以代表另一个元素接受可排序的 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_box div 比列表高。我想让整个 div 代表其列表接受项目。我该怎么做？

Answer 1

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

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

我已为您发布了working example（虽然拖入空列表存在问题，但这是一个新问题；）

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