将可拖动的图像追加到特定的div

Question

我正在使用jQuery和jQuery UI来拖动和缩放图像。 此外我需要将这个图像追加到目标股利。

我的代码：

<div id="decorations"> 

<div style="float:left; margin-left:5px; margin-top:5px;"> 
<img class="dragger" id="obj1" style="cursor: -webkit-grab;" src="objects/bike.png" width="80" height="80"> 
</div> 

<div style="float:left; margin-left:5px; margin-top:5px;"> 
<img class="dragger" id="obj2" style="cursor: -webkit-grab;" src="objects/car.png" width="80" height="80"> 
</div> 

</div> 

我想，当我离开它的格娄追加拖动图像：

<div id="contentHolder"></div> 

代码：

<script> 
$(document).ready(function() { 
window.zindex = 999; 
    $(".dragger").resizable({handles: 'ne, se, sw, nw'}); 
    $(".dragger").parent().draggable({ 
    $(".dragger").appendTo("#contentHolder"); //Tried this one without luck 
    }); 
}); 
</script> 

此外，我试过这个：

<script> 
$(document).ready(function() { 
window.zindex = 999; 
    $(".dragger").resizable({handles: 'ne, se, sw, nw'}); 
    $(".dragger").parent().draggable({  
    accept: '.dragger', 
     drop: function (event, ui) { 
      $('#contentHolder').append(ui.draggable); 
     } 
    }); 
}); 
</script> 

非常感谢！

Answer 1

充分利用contenHolder可放开：

$(".contenHolder").droppable({  
    drop: function(event, ui) {   
     //do something here 
    }  

});