Jquery draggable 요소를 삭제할 때 droppable에 추가하는 방법

Question

편집 : 최종 복제 된 요소를 drappable의 임의 위치로 드래그 할 수있게하고 싶습니다. 정렬 할 수 없도록하고 싶습니다.

나는 그것이 제거 될 때 낙하 할 요소에 내 드래그 - 클론 요소를 추가하기 위해 노력하고있어. 드래그 소자가 낙하 할 요소 내에있는 경우, 그것을 (드래그 소자)가 낙하 할내부 드래그 원한다. 현재 draggable-clone 요소는 해당 위치에서 끌 수 있으며 놓을 때 제거 할 수 없게됩니다. 그러니 제 목표를 달성하도록 도와주세요. 감사. 여기

코드입니다 : 초기 요소가 문서 준비 이벤트에 드래그 하나로 만들어

$(function() { 
 

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

 
    $('#droppable1, #droppable2').droppable({ 
 
     drop: function (event, ui) { 
 
      $(this) 
 
       .append(ui.helper.clone(false).css({ 
 
       position: 'relative', 
 
       left: '0px', 
 
       top: '0px' 
 
      })); 
 
     } 
 
    }); 
 

 
});

.well { 
 
    width: 150px; 
 
    height: 150px; 
 
    border: 3px solid red; 
 
} 
 
.ii{ 
 
    float:left; 
 
    margin-top: 20px; 
 
    margin-right: 20px; 
 
    border: 3px solid blue; 
 
    }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<script src="https://code.jquery.com/ui/1.9.1/jquery-ui.min.js"></script> 
 

 
<div class="well"> 
 
    <div id="draggable">CONTENT</div> 
 
</div> 
 
<div id="droppable1" class="ii well col-md-3" style="z-index:-1;"></div> 
 
<div id="droppable2" class="ii well col-md-9" style="z-index:-1;"></div>

Answer 1

,하지만 당신은 결코 떨어 뜨리지 때 생성되는 새로운 요소는이 코드 실행이 그 위에.

이

$('#droppable1, #droppable2').droppable({ 
    drop: function (event, ui) {   
     $(this) 
      .append(ui.helper.clone(false).css({ 
      position: 'relative', 
      left: '0px', 
      top: '0px' 
     })); 
     /* New stuff here: */ 
     $('.ui-draggable').draggable({ 
      helper: 'clone' 
     }); 
    } 
});