jQuery - 僅在丟棄時克隆div

Question

如何僅在丟棄時才創建某個div的「克隆」？當您開始拖動並準備再次拖動時，此克隆應位於同一點。

例如在這個fiddle是否可以在初始位置克隆綠色元素，只有當它們被丟棄時纔可以？

這是我的JS：

$(function() { 
    $("#dragrabble-one").draggable({ 
    helper: 'clone' 
    }); 
    $("#dragrabble-two").draggable({ 
    helper: 'clone' 
    }); 
    $("#dragrabble-three").draggable({ 
    helper: 'clone' 
    }); 
    $("#dragrabble-four").draggable({ 
    helper: 'clone' 
    }); 
    $("#dragrabble-five").draggable({ 
    helper: 'clone' 
    }); 
    $("#dragrabble-six").draggable({ 
    helper: 'clone' 
    }); 
    $("#dragrabble-seven").draggable({ 
    helper: 'clone' 
    }); 
    $("#dragrabble-eight").draggable({ 
    helper: 'clone' 
    }); 
    $("#dragrabble-one").draggable({ 
    revert: "invalid" 
    }); 
    $("#dragrabble-two").draggable({ 
    revert: "invalid" 
    }); 
    $("#dragrabble-three").draggable({ 
    revert: "invalid" 
    }); 
    $("#dragrabble-four").draggable({ 
    revert: "invalid" 
    }); 
    $("#dragrabble-five").draggable({ 
    revert: "invalid" 
    }); 
    $("#dragrabble-six").draggable({ 
    revert: "invalid" 
    }); 
    $("#dragrabble-seven").draggable({ 
    revert: "invalid" 
    }); 
    $("#dragrabble-eight").draggable({ 
    revert: "invalid" 
    }); 
    $("#droppable-box").droppable({ 
    drop: function(event, ui) { 
     var clone = ui.helper.clone(); 
     clone.draggable(); 
     clone.appendTo('#droppable-box'); 
    } 
    }); 
}); 

在此先感謝。

Answer 1

A， 解決方案可能是，當用戶開始拖動元素並在拖動停止時將不透明度設置爲1時，隱藏克隆元素的不透明度等於0。

$("#dragrabble-one").draggable({ 

    helper: 'clone', 
    start: function (event, ui){ 
     $(this).css('opacity','0'); 
    }, 
    stop: function (event, ui){ 
     $(this).css('opacity','1'); 
    } 

}); 

我希望這可以幫助你！ :)