JQuery UI Sortable - 限制删除某些元素

Question

我有许多 ul，用户可以将 li 分类到其中。我有 2 种不同类型的 li，需要限制它们可以放入哪个列表。这是一个小例子:

<ul class="top">
    <li class=typeA">Item</li>
    <li class=typeA">Item</li>
    <li class=typeB">Item</li>
        <ul class="sub">
            <li class=typeB">Item</li>
            <li class=typeB">Item</li>
            <li class=typeB">Item</li>
        </ul>
</ul>

<ul class="top">
    <li class=typeA">Item</li>
    <li class=typeA">Item</li>
    <li class=typeA">Item</li>
</ul>

1. TypeA 只能出现在顶层，并且只能被放入另一个顶层组中。

2. TypeB 可以出现在顶层或子层，并且必须能够放入任一组中。

3. 此外，子 ul 组必须能够从一个顶级组删除到另一个顶级组。

使用以下代码，我能够实现第 1 点和部分第 2 点，但是当 TypeB 从子组移动到顶部组时，它就永远无法返回:

$(function() {
    $('.connectedSortable').sortable({
        'items': '> li',
        'connectWith': '.connectedSortable'
    });
    $('.subList').sortable({
        'items': 'li',
        'connectWith': '.connectedSortable'
    });
});

任何帮助将不胜感激。

谢谢

Answer 1

我认为仅通过配置表格就可以实现此目的，因为一旦将 B 项目移动到顶层，它的行为就会像 A 项目一样。我认为您必须在每个表上设置事件，例如“over”事件，并编写代码来检查正在移动的项目是否属于此列表。