jquery - 如何在列表之间只有一个方向的 Jquery 可排序元素？

Question

他们是一种启用单一数据方向的方法，其中一个table1只能提供元素并且table2只能接收元素吗？

$(function() {
  $( "#sortable1, #sortable2" ).sortable({
       connectWith: ".connectedSortable"
   }).disableSelection();
});

请原谅我的经验不足，任何信息表示赞赏。

Answer 1

从API 文档：

connectWith： 此列表中的项目应连接到的其他可排序元素的选择器。这是一种单向关系，如果您希望项目在两个方向上连接，则必须在两个可排序元素上设置connectWith 选项。

您提供的代码示例似乎与jQuery UI 演示站点的代码示例相似。如果您研究代码，您会注意到 CSS 类.connectedSortable在两个列表中都声明了：

<ul id="sortable1" class="connectedSortable">
    <li class="ui-state-default">Item 1</li>
    ...
</ul>

<ul id="sortable2" class="connectedSortable">
    <li class="ui-state-highlight">Item 1</li>
    ...
</ul>

您提供的代码将使这个可排序的列表成为双向的。要使其成为单向，您可以指定另一个选择器：

$(function() {
  $( "#sortable1, #sortable2" ).sortable({
       connectWith: "#sortable2" // changed this to reflect the ID of the second list
   }).disableSelection();
});

例如，请参阅jsFiddle