如何更改被拖放到可排序列表中的项目的 UI？

Question

我有两个 jQuery UI 可排序列表。当我将拖动的项目放到最终列表中时，我想更改它的 UI（从源列表中的一个小部件开始，但在放入目标列表时将其分解为详细视图）。有没有人知道我可以如何做到这一点，或者是否有可能？

Answer 1

您可以使用stop 事件：

当排序停止时触发此事件。

你会有这样的东西：

stop: function(event, ui) {
    $(ui.item[0]).html('Replace the HTML as needed.');
}

现场演示：http://jsfiddle.net/ambiguous/Cb5BQ/

您希望跟踪类中的当前状态（小或大），以便您可以根据需要在“小部件”版本和“详细视图”版本之间切换。