將DIV從側邊欄與jQuery UI的

Question

表我beginer到js和jQuery和我需要一點點的幫助，如果有人能幫助我...

我要做些什麼？

我想將div從側欄拖到表格中。在側邊欄div必須只能拖動到表格。當我將div拖放到表格中時，表格中的div必須可以調整大小並再次拖動。

照片：

我嘗試用這個代碼，但不工作得很好：

$(function() { 
    $(".draggable").resizable(); 
    $(".draggable").draggable({revert: 'invalid', helper:'clone', snap: "#drop_here td", opacity: 0.7}); 
    $("#drop_here td").droppable({ 
     accept: '.draggable', 
     drop: function(event, ui) { 
     $(this) 
      .find("p") 
      .html("Dropped!"); 
     } 
    }); 
    }); 

DEMO及源代碼：http://jsbin.com/erofot/17/edit | http://jsbin.com/erofot/17

Answer 1

這裏是你如何能做到這一點，則：（更換你有jsbin使用此代碼） jsbin

$(function() { 
    //$(".draggable").resizable(); 
    $(".draggable").draggable({ 
     revert: 'invalid', 
     helper:"clone", 
     snap: "#drop_here td", 
     opacity: 0.7 
    }); 
    $("#drop_here td").droppable({ 
     // accept only from left div, 
     // this is necessary to prevent clones duplicating inside droppable 
     accept: '#left .draggable', 
     drop: function(event, ui) { 
     // 4 append clone to droppable 
     $(this).append(
      // 1 clone draggable helper 
      $(ui.helper).clone() 
      // 2 make the clone draggable 
      .draggable({containment:"parent"}) 
      // 3 make the clone resizable 
      .resizable()); 
     } 
    }); 
    });