问jQuery UI可排序:拖放和重新排序交互的性能

EN

$(function() {
  // Add items to picker.
  for (i = 0; i < 10; i++) {
    var $item = createItem(i);
    $("#picker").append($item);
  }

  // Set up sortable.
  $("#composer")
    .sortable({
      items: "> .item",
      receive: function(event, ui) {
        var data = ui.item.attr("data-item");
        var dataAttr = "[data-item='" + data + "']";
        // If the element was actually dropped in the composer
        if ($("#composer .item"+ dataAttr).length > 0) {
          $("#picker .item" + dataAttr)
            .draggable("disable")
            .addClass("inactive");
        }
      }
    })
});

function createItem(i) {
  var $item = $("<div>" + i + "</div>")
    .addClass("item")
    .attr("data-item", i)
    .draggable({
      connectToSortable: ".connected-sortable",
      revert: "invalid",
      revertDuration: 100,
      appendTo: "body",
      helper: "clone",
      refreshPositions: true
    });

  return $item;
}