javascript - JQuery UI - 将 Draggable 附加到 Droppable

Question

如何使用 jQueryUI 的 draggables/dropables 将被拖动的项目附加到放置的目标元素？看起来 jQuery UI 现在的工作方式是它只是通过绝对定位在屏幕上移动项目。不幸的是，此功能使表单提交毫无用处，因为您无法在提交时获得值的位置。

提前感谢任何项目/指针！

Answer 1

如果我理解正确，您希望将拖动的元素与其当前父元素分离并附加到新元素，对吗？您可以使用助手进行拖动（因此原始元素不受影响），并在放置时将其分离并将其附加到目标（感谢@Oleg 和@Brian 改进了我的原始答案）。

$(myDraggable).draggable({
    helper:"clone",
    containment:"document"
});

$(myDroppable).droppable({
    drop:function(event, ui) {
        ui.draggable.detach().appendTo($(this));
    }
});

​ jsFiddle的工作示例