JQuery UI - 将Draggable添加到Droppable

如何使用jQueryUI的可拖动/可拖拽添加拖放到拖放目标元素的项目？它看起来像jQuery UI现在的工作方式是它只是通过绝对定位在屏幕上移动项目。不幸的是，这个功能使得表单提交无用，因为你无法获得提交值的位置。JQuery UI - 将Draggable添加到Droppable

在此先感谢您的任何项目/指针！

来源

2012-05-22 user1110302

以我的经验

$(myDraggable).draggable({ helper:"clone", containment:"document" }); $(myDroppable).droppable({ drop:function(event, ui) { ui.draggable.detach().appendTo($(this)); } });

工作示例，它实际上修改DOM以反映新的定位;我知道，因为我更新列表（通过AJAX），并涉及扫描'完成'回调中的新div命令。你想做什么？ – Sp4cecat

你到底在做什么？这听起来像你可能会寻找sortable而不是draggble：http://jqueryui.com/demos/sortable/ –

如果我理解正确，你想拖动的元素从它的当前父母分离并追加到新的，对吧？你可以使用助手做拖拽操作（所以原始元素不受影响），在拖拽时将它分离并附加到目标上（感谢@ Oleg和@Brian，以改进我的原始答案）。在jsFiddle

来源

2012-05-23 00:09:54 mgibsonbr

非常感谢你的帮助mgibsonbr！我非常感谢您为此写下的时间和精力！ – user1110302

这是非常有用的，谢谢 –

你不需要使用任何全局变量 - ui.helper是可拖动的jq对象。你可以删除启动/停止方法，并在拖放它应该是ui.helper.detach（）。appendTo（$（this））。 – Oleg

JQuery UI - 将Draggable添加到Droppable

回答

相关问题