0

jQueryのドラッグ可能なUIには非常に簡単な問題があります。関数を入力したところ、その名前は inid_drag で、ajax を呼び出した後にうまく機能しました。しかし、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/>");
                        }
                    });
                }
            });
        });
4

1 に答える 1

1

$("#classID").change(function(){} あなたがそれ を呼び出すとき 

init_drag();

と ajax メソッドは同時にですが、応答 ajax は init_drag() メソッドよりも時間がかかるため、ajax で返信を受け取ったときに、html を追加するため、html またはドラッグ機能が ur html に重なっています。

于 2013-07-18T06:50:54.543 に答える