Javascript jQuery/jQuery UI嵌套可排序列表，其中不能嵌套父文件夹

我正在尝试使用jquery/jQueryUI创建嵌套文件夹结构

但是，与许多示例不同，我不希望父文件夹嵌套在另一个父文件夹中

简言之：

我想调整以下脚本，以便子文件夹可以移动到其他子文件夹

有没有人处理过类似的事情，或者知道一个好的例子

到目前为止，我已经提供了一个JS小提琴

文件夹1
子文件夹1
项目1
项目2
项目3
子文件夹2
项目A
B项
项目C
文件夹2
子文件夹A
项目1
项目2
项目3
子文件夹B
项目A
B项
项目C
$（函数（）{
$（“.folder container”）.sortable({
连接到：“.folder container”，
排序：函数（e）{
}
});
$（“.sortable文件夹”）.sortable({
连接到：“.sortable文件夹”，
排序：函数（e）{
}
});
$（“.sortable子文件夹”）.sortable({
连接到：“.sortable子文件夹”，
排序：函数（e）{
}
});
$（“.sortable”）.disableSelection（）；
});

---

提前谢谢你

请澄清，您是否希望能够将“子文件夹B”移动到“子文件夹A”，反之亦然？您希望对子文件夹执行什么操作？应该只移动子文件夹的子文件夹，还是子文件夹将成为父子文件夹的直系后代？只是澄清一下，您希望能够将“子文件夹B”移动到“子文件夹a”中，反之亦然？您希望对子文件夹执行什么操作？应该只移动子文件夹的子文件夹，还是子文件夹将成为父子文件夹的直接后代？

<div id="appSpace" class="folder-container">
    <div class="folder sortable-folder">
        Folder 1
        <div class="sub-folder sortable-sub-folder">Sub Folder 1
            <div class="folder-item">Item 1</div>
            <div class="folder-item">Item 2</div>
            <div class="folder-item">Item 3</div>
        </div>
        <div class="sub-folder sortable-sub-folder">Sub Folder 2
            <div class="folder-item">Item A</div>
            <div class="folder-item">Item B</div>
            <div class="folder-item">Item C</div>
        </div>
    </div>
    <div class="folder sortable-folder">
        Folder 2
        <div class="sub-folder sortable-sub-folder">Sub Folder A
            <div class="folder-item">Item 1</div>
            <div class="folder-item">Item 2</div>
            <div class="folder-item">Item 3</div>
        </div>
        <div class="sub-folder sortable-sub-folder">Sub Folder B
            <div class="folder-item">Item A</div>
            <div class="folder-item">Item B</div>
            <div class="folder-item">Item C</div>
        </div>
    </div>
</div>

$(function() {
        $(".folder-container").sortable({
            connectWith: ".folder-container",
            sort: function(e) {
            }
        });
        $(".sortable-folder").sortable({
            connectWith: ".sortable-folder",
            sort: function(e) {

            }
        });
        $(".sortable-sub-folder").sortable({
            connectWith: ".sortable-sub-folder",
            sort: function(e) {

            }
        });
        $( ".sortable" ).disableSelection();
    });