Jquery Draggable/Droppable 여러 div 추가 중

Question

여러 div를 수용 할 수있는 삭제 가능 영역을 얻으 려하지만 가장 최근에 선언 된 것만 수용합니다. 이 문제를 해결하는 방법을 찾는 데 어려움이 있습니다. 여기

코드입니다 :

$(".square").draggable({helper: 'clone'}); 
$(".rect").draggable({helper: 'clone'}); 

$("#canvas").droppable({ 
    accept: ".square", 
    accept: ".rect", 
    drop: function(ev,ui){ 
     $(ui.draggable).clone.appendTo(this); 

Answer 1

당신은 "동의"이용해야 가능 요소

의 선택기를 정의하기 위해 한 번만

Answer 2

당신은 광장과 RECT 같은에서 별도의 클래스를 만드는 시도해야

"droppableShape". 그런 다음 각 클래스에 두 번째 클래스로 추가하고 하나만 사용할 수 있습니다.

HTML

<...class="square droppableShape"..../> 
<...class="rect droppableShape".../> 

JQuery와

$(".droppableShape").draggable({helper: 'clone'}); 

$("#canvas").droppable({ 
accept: ".droppableShape", 
drop: function(ev,ui){ 
    $(ui.draggable).clone.appendTo(this); 

Answer 3

당신이 개체를 두 번 accept 옵션을 전달하면 최신 하나가 덮어 쓰게됩니다 첫 번째

는 시도

$(".square").draggable({helper: 'clone'}); 
$(".rect").draggable({helper: 'clone'}); 

$("#canvas").droppable({ 
    accept: ".rect, .square", 
    drop: function(ev,ui){ 
     $(ui.draggable).clone().appendTo(this); 
    } 
}); 

데모 : Fiddle