javascript - Dynamically Create Droppable Element

Question

I'm implementing drag and drop using the jQuery UI Draggable and Droppable widgets. (Sortable didn't provide quite enough flexibility for me.)

As I drag, I'm dynamically creating a drop placeholder element to show precisely where a drop would be placed.

But how can I make this drop placeholder droppable itself? If I create it and then immediately call the droppable() method on it, this has no effect. And so if they user drops directly over a drop placeholder, how could I detect this?

You can see what I have so far at http://jsbin.com/uciviy/14.

Answer 1

可以动态创建 div 并使其可放置。

您可以通过 JQuery 创建 div，然后使其可放置，或者当拖动事件在可拖动元素上开始时创建可放置 div，并且该元素可以放置在创建的新 div 上。这可能是这样的：

$( "<div>Dynamic Droppable Div</div>" ).droppable( dropOptions ).appendTo( "#anotherDiv" );

在这里拉小提琴。