如何使可拖动捕捉到可放置，允许交换？答案

【问题标题】：How to make a draggable snap to a droppable, allow swapping?如何使可拖动捕捉到可放置，允许交换？
【发布时间】：2011-12-28 22:30:27
【问题描述】：

我不知道怎么问这个问题，但我希望创建一个界面，其中左侧存在三个元素（A、B、C）并且可以拖动到右侧的三个元素（1、2、 3).

我希望左边的物品在掉落时能吸附到右边的物品上，然后可以与其他两个物品互换。

我可以让 A、B 和 C 对齐到右侧，但似乎无法让它们能够交换。如果我将ui.draggable.position 设置在drop 上，那么我无法弄清楚如何在右侧重新排列它们。我尝试克隆和删除它们无济于事，我最终得到了一些错误。

到目前为止我有这个：http://jsfiddle.net/7xFsr/13/

提前致谢！

【问题讨论】：

【解决方案1】：

我知道我有一个特定的问题，但这是我的解决方案。终于想通了如何操作 jQuery UI position() 功能。

我创建了一个数组，其中包含每个起始节点的 id 以及它们的包装器（以恢复位置）。

在放置时，我有一个方法遍历数组并找出该位置是否有任何东西掉落。如果没有，没问题。如果是这样，请返回数组并找到当前被删除的项目并获取其先前的容器。选择已经存在的那个并将其位置更改为当前的先前位置，并将当前的放置在现在为空的位置。

有点复杂，但我使用相同的 jsfiddle 解决了这个问题：http://jsfiddle.net/7xFsr/35/

希望这对某人有所帮助！

【讨论】：