Jquery ui 如何将jquery ui可排序列表中的一个项目放入该列表中的另一个项目中

我有一个使用jquery ui的可排序列表：

<div id="sortable">
  <div class="ui-state-default">Item 1</div>
  <div class="ui-state-default">Item 2</div>
  <div class="ui-state-default">Item 3</div>
  <div class="ui-state-default">Item 4</div>
  <div class="ui-state-default">Item 5</div>
</div>

<script>
  $( function() {
    $( "#sortable" ).sortable({
      revert: true
    });
  } );
 </script>

项目1
项目2
项目3
项目4
项目5
$（函数（）{
$（“#可排序”）。可排序({
回复：真
});
} );

在某些情况下，我希望能够将可排序列表中的一个项目放到另一个项目中。例如，当我拖动

项目1

并将其直接放在

项目3

上时，它将被插入

项目3

中，而不会成为它之前或之后的同级div

---

我在jquery ui文档中找不到任何东西，事实上，我需要在拖动另一个项目时获取该项目。

根据Sortable的基本示例创建了以下内容。本例中的子元素用作每个列表项的子列表

$（函数（）{
函数大小调整（t，c）{
var h=（c*18）+9；
var p=（c*1.2）+0.6；
t、 css（“高度”，“计算”（+h+“px+”+p+“em）”）；
}
$（“#可排序”）。可排序({
连接到：“.child列表”，
句柄：“.ui-icon-arrow-2-n-s”，
项目：“>div.ui-state-default”
});
$（“#可排序”）.disableSelection（）；
$（“.child list”）。可排序({
连接到：“.parent list”，
接收：功能（e、ui）{
var numItems=$（“.ui状态默认值”，this）.length；
调整大小（$（this）.closest（.ui状态默认值），numItems）；
},
删除：功能（e、ui）{
var numItems=$（“.ui状态默认值”，this）.length；
调整大小（$（this）.closest（.ui状态默认值），numItems）；
}
});
});
#可排序{
保证金：0；
填充：0；
宽度：340px；
}
#可排序>分区{
保证金：0 3px 3px 3px；
填充：0.4em；
左侧填充：1.5em；
字号：1.4em；
高度：18px；
}
#可排序>分区>范围{
位置：绝对位置；
左边距：-1.3em；
}
#可排序。子列表{
显示：块；
宽度：钙（340像素-2米）；
最小高度：1米；
}
#可排序。子列表>div{
背景：#999；
字号：0.8em；
}
.ui状态突出显示{
高度：1.5em；
线高：1.2米；
}

项目1
项目2
项目3
项目4
项目5
要确认，是否要使项目可拖放，以便在拖放时，项目成为项目的子项，而不是作为同级排序？默认情况下，这不是可排序的功能。您需要在删除或更新时创建层次结构（构建新的列表容器）。