jQuery 라이브 draggable/라이브 droppable?

Question

여기 내 코드입니다. 일부 클래스를 추가하고 일부 클래스를 제거했습니다. CSS는 디자인을 잘 나타내지 만,이 함수에 추가 한 클래스를 사용하고자 할 때 jQuery는이를 얻지 못한다. 라이브 또는 'on' 기능을 사용하려면 어떻게해야합니까? droppable 함수에서 다시 사용할 수 있도록이 클래스에 액세스하려면 어떻게합니까?

$(".droppable").droppable({ 
    drop: function(event, ui) { 
     $(this).removeClass('droppable'); 
     $(this).removeClass('ui-droppable'); 

     var dragIMG = '<img class="dragBox ui-draggable" data-type="'+img+'" src="img/'+img+'.jpg" alt="" style="position: relative;"/>'; 
     $(this).append(dragIMG); 
     $('#box'+box).empty(); 
     $('#box'+box).addClass('droppable'); 
     $('#box'+box).addClass('ui-droppable'); 
    } 
}); 

Answer 1

이벤트 핸들러를 위임 할 수있는 것과 동일한 방식으로 플러그인을 위임 할 수는 없습니다. 선택기는 실행될 때 일치하는 요소를 선택한 다음 해당 요소에 필요한 초기화가 수행되도록 플러그인 코드가 실행됩니다. 나중에 셀렉터와 일치하는 새 요소에는 초기화 코드가 필요하지 않습니다.

플러그인 기능을 다시 호출해야합니다.

var droppableOptions = { 
    drop: function (event, ui) { 
     $(this).removeClass('droppable'); 
     $(this).removeClass('ui-droppable'); 

     var dragIMG = '<img class="dragBox ui-draggable" data-type="' + img + '" src="img/' + img + '.jpg" alt="" style="position: relative;"/>'; 
     $(this).append(dragIMG); 
     $('#box' + box).empty().addClass('droppable').addClass('ui-droppable').droppable(droppableOptions); 
    } 
} 

$('.droppable').droppable(droppableOptions); 

Answer 2

을 또는 당신은 플러그인이라고 livequery (https://github.com/brandonaaron/livequery)를 사용하고 dragable 기능을 호출 할 수 있습니다 이런 식으로 뭔가 작업을해야합니다.

예

$('a') 
.livequery('click', function(event) { 
    alert('clicked'); 
    return false; 
});