jQuery UI Draggable/Sortable - 获取对新项目的引用答案

【解决方案1】：

在您引用的演示中，实际上存在一个错误；在您向下拖动一个项目后，它会插入一个克隆的 li 和一个 id，这是它兄弟的副本到 DOM 中，所以要小心（一个 bug 已被归档，但周围没有任何活动）。

我做了一些事情来实现这一点：

为了绕过我上面描述的演示的限制，改为将class 应用于将链接到sortable 的可拖动项目：
```
<ul>
    <li class="new-item ui-state-highlight">Drag me down</li>
</ul>
```

使具有该类的项目可拖动，而不是通过id 选择元素：

 $(".new-item").draggable({
     connectToSortable: "#sortable",
     helper: "clone",
     revert: "invalid"
 });

点击可排序的stop event，并对已删除的项目执行一些简单的逻辑，利用以下事实：类new-item 的项目只能被删除（并且不仅仅是现有的排序中的项目）：

$("#sortable").sortable({
    revert: true,
    stop: function(event, ui) {
        if (ui.item.hasClass("new-item")) {
            // This is a new item
            ui.item.removeClass("new-item");
            ui.item.html("<b>HI</b>");
        }
    }
});

请注意，您可以使用 data-* 属性而不是添加帮助程序类。

这是一个工作示例：http://jsfiddle.net/andrewwhitaker/twFCu/

希望对您有所帮助。

【讨论】：

谢谢你，我也遇到了一些麻烦。
我正在尝试使用 stop 进行所有操作 - 在 .draggable 上却无处可去 - 为我节省了大量时间，谢谢
@reabow：很高兴为您提供帮助！

【解决方案2】：

如果您想要另一种非常粗略的方法来获取该项目只是为了删除它或其他东西，只需在下拉列表中将其引用为

var _clone = $(".ui-draggable-dragging");

当然，该类在删除之后就被删除了，因此引用会丢失，您无法立即执行任何操作。

上面的答案更可靠，但如果你很着急......

【讨论】：

【解决方案3】：

如果您不害怕访问Sortable 的内部状态，您可以执行以下操作：

$('#sortable').sortable({
  receive: function() {
    // Sortable.currentItem refers to the item just added.
    // jQuery UI < 1.10 uses "sortable" as its data key,
    // jQuery UI >= 1.10 defines an "instance" method to get the current instance.
    var $item =
      (
        $('#sortable').data('sortable') || // jQuery UI < 1.10
        $('#sortable').sortable('instance') // jQuery UI >= 1.10
      ).currentItem;
  }
);

小提琴：http://jsfiddle.net/t33bt/12/

但请记住，这在未来的 jQuery UI 版本中可能不再适用，因为它不使用官方 API。但即使在 jQuery UI 1.11（撰写本文时的当前版本）中它也能正常工作。

【讨论】：