jQuery UI Draggable은 ajax 호출 후에 만 ​​작동합니다.

Question

jQuery 드래그 가능한 UI에는 매우 쉬운 문제가 있습니다. 필자는 이름이 inid_drag 인 함수를 입력하고, 아약스가 잘 작동한다고 말한 후에 함수를 입력했습니다. 하지만 Ajax 호출 전에 입력하면 작동하지 않습니다. 드래그에 대한

따르 코드 :

function init_drag(){ 

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

팔로우 코드가 제대로 작동 :

 $("#classID").change(function(){ 
       var classID = $(this).val(); 

      $.ajax({ 
       async: false, 
       type: "POST", 
       dataType: "json", 
       data:"classID=" + classID, 
       url: "views/timeTablesAjax.php", 

       success:function(data){ 

        $("#lessonTeacher").html(""); 

        $("#timeTable").hide(); 
        $("#timeTable").show("slow"); 

        $("#timeTable td").not(".notDrop").html(""); 

        $.each(data,function(i,persons){ 

         $("#lessonTeacher").append("<b>" + persons[0].code + "</b><br/>"); 
         for(var i = 0; i < persons.length; i++){ 

          $("#lessonTeacher").append("<li class='token-input-token-facebook' style='list-style-type: none;'>" + 
           "<p style='padding-left: 10%;' data-id=" + persons[i].ID + ">" + persons[i].staff + "</p>" + 
           "<span class='infoBox' style='background-color: #808080;'><img src='BT/upload/info.ico' width=10 height=10></span></li><br/><br/>"); 
         } 
        }); 
        // in this function has got draggable codes. 
        init_drag(); 
       } 
      }); 
     }); 

팔로우 코드는 작동하지 않습니다 :

 $("#classID").change(function(){ 
       var classID = $(this).val(); 
        // in this function has got draggable codes. 
        init_drag(); 

      $.ajax({ 
       async: false, 
       type: "POST", 
       dataType: "json", 
       data:"classID=" + classID, 
       url: "views/timeTablesAjax.php", 

       success:function(data){ 

        $("#lessonTeacher").html(""); 

        $("#timeTable").hide(); 
        $("#timeTable").show("slow"); 

        $("#timeTable td").not(".notDrop").html(""); 

        $.each(data,function(i,persons){ 

         $("#lessonTeacher").append("<b>" + persons[0].code + "</b><br/>"); 
         for(var i = 0; i < persons.length; i++){ 

          $("#lessonTeacher").append("<li class='token-input-token-facebook' style='list-style-type: none;'>" + 
           "<p style='padding-left: 10%;' data-id=" + persons[i].ID + ">" + persons[i].staff + "</p>" + 
           "<span class='infoBox' style='background-color: #808080;'><img src='BT/upload/info.ico' width=10 height=10></span></li><br/><br/>"); 
         } 
        }); 
       } 
      }); 
     }); 

Answer 1

전화 할 때 $("#classID").change(function(){} 이

을 실행

init_drag(); 

와 아약스 방법 동시에하지만 responce 아약스에서 당신이 아약스 html로 또는 HTML을 추가하기 때문에 UR HTML을 중복 기능을 드래그로 응답있어 그렇게 할 때 다음 init_drag() 메소드 더 많은 시간이 걸립니다.