2

私はいくつかの大規模なクエリ用のスクリプトを作成しており、php 側でのタイムアウトを回避するために、さらにユーザーに入力を与えるために、そのほとんどを jquery で作成しようとしています。

したがって、次のように機能します。最初に、ユーザーは select で 1 つのレコードを選択します。彼がボタンをクリックすると、json 形式のレコードから必要な詳細を取得するための ajax 呼び出しが行われました。

応答により、最初の呼び出しの結果ごとに ajax 呼び出しを行うループが発生しました。

async を false に設定すると機能しますが、いくつかの ajax 呼び出しがあるため、ブラウザーがフリーズします。非同期をオフにしてUIを更新する方法はありますか?

つまり、ループ内で ajax 呼び出しを行っているときに async をオフに設定する必要があるという事実は、私には意味がありません。同時に複数の呼び出しを行うことができますが、それで問題ありませんが、async を false に設定しない限り、そのループ内で現在のインデックスを取得できないのはなぜですか? 最初のインデックスを使用し続けます。

    $("#button_copy").live('click', function(){
        $('#button_copy').attr("disabled", true);
        id = $('#select').val();
        $.ajax({
            type: "POST",
            url: "query1.php",
            dataType: 'json',
            async:false,
            cache: false,
            data: 'id=' + id,
            success: function( data ) {
                var total1 = data['records'].length;
                $("#console").append('Total query 1: ' + total1 + '<br />');
                for (var i in data['records']) {
                    $.ajax({
                        type: "POST",
                        url: "query2.php",
                        dataType: 'json',
                        async:false,
                        cache: false,
                        data: 'id=' + data['records'][i].id,
                        success: function( data2 ) {
                            var total2 = data2['records2'].length;
                            $("#console").append('Total of query 2 from ' + data['records'][i].person + ': ' + total2 + '<br />');
                        },
                        error: function(data2) {
                            console.log(data2);
                        }
                    });
                    var percentprogress1 = (i / total1) * 10000;
                    $('#progressbar1').css('width',percentprogress1 + '%');
                }
            },
            error: function(data) {
                console.log(data);
            }
        });
    });
4

2 に答える 2

1

私自身も同様の問題に遭遇しました。while ループで一連の ajax リクエストを実行していました。一部の通話が行われませんでした。それは私を殺していた!! 私の結論は、私のブラウザー (Google Chrome) は「重複した」リクエストを無視するというものでした。

次の疑似コードを見てください。

while (i < ajaxCallArray.length) {
    currentAjaxObject = ajaxCallArray[i];
    ajaxPost = $.post(currentAjaxObject.url, function(data) {
    //response data needs to go into a function such that each request gets its own "data" variable created.otherwise it just overwrites data!!
    processAjaxResponse(data, currentAjaxObject);
        },"json");
i++;
}

もしajaxCallArray[0].url = "http://www.google.com"、、、ブラウザが実際ajaxCallArray[1].url = "http://www.google.com"にajaxCallArray[2].url = "http://www.google.com"呼び出すのは1回だけです!!

解決策: ajaxCallArray[0].url = "http://www.google.com?count=0"、のようなことをしなければなりません。これらの URL パラメーターを使用しない場合でも、それらを区別するために何かを入れるだけですajaxCallArray[1].url = "http://www.google.com?count=0"。ajaxCallArray[2].url = "http://www.google.com?count=0"そうすれば、ブラウザーはすべての呼び出しを処理します。

お役に立てれば！！

于 2013-09-01T18:39:55.637 に答える