jquery - 复制拖动的项目

Question

我有一个可以拖拽的图片列表。

拖动我使用

 $('.test').draggable({opacity: 0.5}).resizable();

我想将拖动的 div 复制到它被拖动的 div 中。所以如果我拖动

 <div class="test">
  <img src="test.png">
 </div>

进入

  <div id="box">
  </div>

它应该变成

 <div id="box">
   <div id="test">
   <img src="test.png">
   </div>
 </div>

我想要它在 div 框中，因为我已经打印了 div 框。因此，如果它不在 div 框中而是在其上方，则不会打印 img。

我可以看到它的使用

$('.box').droppable({
    drop: function( event, ui ) {
    $( this )
    .addClass( "ui-state-highlight" )
    .find( "p" )
    .html( "Dropped!" );
  }
});

Answer 1

你应该使用 jquery ui draggable 和 droppable 并使用 helper clone，如果你想复制内容，如果你想移动内容，只需在 droppable 上做一个追加，再见。

Answer 2

里面

$("#bord").droppable
    ({  
        greedy: true,
        tolerance:"pointer",
        drop: function (event, ui) 
        {
             //here
        }

我有

        .addClass('sleep').appendTo($(this))

这就是我所需要的。

追加为我做了诀窍。

关于附加的一些信息。

链接到 jquery api 示例

说明：将参数指定的内容插入到匹配元素集中每个元素的末尾。