0

好的，我在这里要做的是让 jQuery UI 在通过克隆将新列动态添加到页面时更新页面上显示的可排序项。如果您克隆一列（演示页面），新列应该能够接收现有列列表中的两个项目以及可以从顶部列表 A 拖动到其中一个可排序项中的新项目。这适用于初始设置，但是一旦您克隆并附加新列，事情就会中断；新克隆的列未被识别为可放置目标，我也无法将新项目从列表 A 拖到新克隆的列列表中。

直观地说， sortable('refresh') 命令应该足以让 sortable 检查设置中的任何内容是否发生更改，并使新元素能够接收和处理可排序项目。但是，我尝试在单击按钮时执行此操作，但似乎没有效果。

我还尝试再次直截了当地调用“.columnlist”选择器上的整个 sortable() 插件，希望它会在新匹配的元素上进行初始化，并简单地跳过已经具有可排序的元素。

哦，当然我使用 clone(true, true) 来确保事件和数据随之而来。

请在此处查看演示页面：http: //labs.shifthappens.nl/dragsort/ 尝试以下操作：

  1. 将项目从列表 A 拖动到列列表 A 或 B。拖动到可排序的作品
  2. 对列列表 A 中的项目重新排序。可排序的作品。
  3. 单击克隆按钮。出现 C 列的克隆。
  4. 尝试将任何项目（无论是从列表 A 还是从另一个列列表）拖动到克隆的列 C 并注意：它没有响应。就好像它不存在一样。
  5. 有趣的是：如果您已经将项目放在原始 C 列中，然后将其克隆，则克隆列中的项目可以移动到其他列表，但一旦移出，就无法移回克隆列表。仿佛它拒绝了自己的后代。

如何使克隆的列表也可排序和有效的放置区？

4

1 回答 1

0

正如 jaredhoyt 所指出的，这确实是关于深度克隆。显然 jquery ui 不需要深度克隆的元素，如果你这样做并且期望新元素也是可放置的目标，实际上会中断。

但是，我确实发现需要在要识别克隆列表的列上再执行一次 $('selector').sortable() 。这也是 jaredhoyt 在他的小提琴中所做的。这虽然对我来说直观地“刷新”方法将是最优雅的解决方案，不是吗？

总之，结案了。我很高兴它就像不使用数据和事件克隆列一样简单，只是 HTML。

于 2012-05-05T00:05:46.113 回答