AJAX 호출 후 jQuery 작업을 수행하는 방법

Question

몇 가지 게시물을 읽었지만 아무도 특정 답을 제공하지 않았거나 질문이 불필요하게 복잡해졌습니다. 나는 그것을 간단하게 유지할 것이다.

draggable/droppable 함수에 jQuery UI를 사용하고 있습니다. draggable이 대상 요소에 놓이면 AJAX 함수가 호출됩니다. 그것은 모두 정상적으로 작동하지만 단 한 번. 다시 시도 할 때 요소를 더 이상 끌 수 없습니다.

function AjaxFunction (var1, var2) { 
    var url = "ajax/script.php"; 
    var data = {position: var1, tag: var2}; 
    $.post(url, data, function(data) { 
     $(".target").html(data).show(); 
    }); 
} 

사람이 나에게 그것이 작동하는 방법에 위의 코드에 특정 솔루션을 제공 할 수 :

$(document).ready(function() { 
    $(".item").draggable(); 
    $(".target").droppable({ 
     drop: function(){ 
      AjaxFunction(var1, var2); 
     }    
    }); 
}); 

이 단순화 된 AjaxFunction는 : 여기 내 (간체) 코드는?

Answer 1

당신은이 게시물을 참조 할 수 있습니다 :

이

Jquery Draggable - How do I create a new draggable div on the fly that can then be dragged?

특히이 부분 :

$(element).draggable('disable'); 

및

$(element).draggable('enable'); 

그것은 정확히 같은 아니지만 그것을 제공 문제에 대한 통찰력. 기본적으로 draggable 및 droppable을 비활성화 한 다음 Ajax 성공 후 다시 활성화하려고 할 수 있습니다.

function AjaxFunction (var1, var2) { 
    var url = "ajax/script.php"; 
    var data = {position: var1, tag: var2}; 
    $.post(url, data, function(data) { 
     $(".item").draggable("destroy"); 
     $(".target").droppable("destroy"); 

     $(".target").html(data).show().droppable({revert:true}); 
     $(".item").draggable(); 
    }); 
}