Jquery中的可排序VS DragnDrop

时间:2012-05-04 11:43:34

标签: jquery jquery-ui jquery-ui-sortable jquery-ui-draggable jquery-ui-droppable

当我尝试使用Jquery对某些数据进行排序时,我想我会使用拖放操作。后来,我访问了jQueryui网站。它们具有“拖放”功能和可排序功能。

现在,我实现了“拖放”功能,对HTML表行进行排序,同时保存其在数据库中的位置。

但现在我感到困惑:

  1. Sortable是否也能执行相同的功能?
  2. Sortable是否仅适用于UL或OL或LI?它可以与Table Row一起使用吗?
  3. 拖放行时有什么区别? (交换位置),与Sortable(排序行)相比。这些不同的情况?我真的很困惑这些概念。
  4. 使用HTML表行进行排序是正确的方法(通过Draggable和Droppable,就像我现在一样)?
  5. 何时使用Sortable与Draggable / droppable
  6. 有任何指导原则

1 个答案:

答案 0 :(得分:5)

Sortable也适用于表格,see this jsFiddle

关于Sortable和Drag& Drop之间的差异,他们只是回答了两个不同的需求:

  • sortable是一种拖放操作,但是为预定义的项目组实现了所有必需的图形行为。移动项目时,所有其他项目都会相应移动。
  • 另一方面,
  • 拖放允许您简单地取一个项目并四处移动(可拖动),但您必须选择放下它的项目(可放置)。

使用sortable,您正在搜索带有排序项的逻辑行为。通过drap& drop,您可以搜索项目之间的互动。

例如,组织桌面图标就像是可排序的(移动图标会移动其他人以重新组织它们)。如果你把一个文件夹放到另一个文件夹中,就像draggable / droppable一样(拿一个文件夹并将其拖放到另一个文件夹上不会重新组织它,但会触发一个动作,将文件夹移到另一个文件夹中)。

查看SortableDraggable / Droppable的jQuery UI文档。

希望这会对你有所帮助。