0

私は次のコードを持っています：

$(document).ready(function () {

        $('div.env').each(function (index, item) {

            var vm = $(item).text();
            alert(vm);
            var url = "http://localhost:56656/HTML" + vm + ".htm";
            alert(url);
            $.ajax(url, {
                type: "GET",
                dataType: "html",
                success: function (data) {
                    alert("Colouring");
                    var style = $(data).filter('div').attr('style');
                    var styleObj = {};
                    $.each(style.split(';'), function () {
                        var rule = this.split(':');
                        styleObj[$.trim(rule[0])] = $.trim(rule[1]);
                    });

                    $(item).css('background', styleObj.background);

                },
                error: function () {
                    alert("Error");
                    $('div').css('background', '#f00');
                }
            });

        });

問題は、Ajax関数が実行される前に、divクラス「env」内の値ごとにアラートが発生することです。

私が欲しいのは、各divについて、値を取得し、ajaxを実行し、次の次の値を取得することです。ajaxは最後に完全に実行されているようです。

助けてくれてありがとう。

4

3 に答える 3

0

async: falseajax呼び出しを設定します。それは遅くなりますが、それはあなたが望むことをします。

参照：

于 2012-07-09T10:15:36.607 に答える
0

Ajax呼び出しはデフォルトで非同期であるため、ループは実行を継続し、最初のajax呼び出しが完了する前に完了する可能性があります。

ループでajax呼び出しを行うことは、正直に言うと良い方法ではないようです-私があなただったら、別のアプローチを試してみます。

于 2012-07-09T10:12:20.510 に答える
0

これが、すでに使用しているコールバック関数のすべてです。クエリが完了すると呼び出されます。例：

$.ajax(url, {
    type: "GET",
    dataType: "html",
    success: function (data) {
        /* this code will be run when the query is complete */
    },
    error: function () {
        /* this code will be run when the query fails */
    }
});

次のようなものを試してください。

$(document).ready(function () {

        $('div.env').each(function (index, item) {


            $.ajax(url, {
                type: "GET",
                dataType: "html",
                success: function (data) {
                    alert("Colouring");
                    var style = $(data).filter('div').attr('style');
                    var styleObj = {};
                    $.each(style.split(';'), function () {
                        var rule = this.split(':');
                        styleObj[$.trim(rule[0])] = $.trim(rule[1]);
                    });

                    $(item).css('background', styleObj.background);

                    var vm = $(item).text();
                    alert(vm);
                    var url = "http://localhost:56656/HTML" + vm + ".htm";
                    alert(url);

                },
                error: function () {
                    alert("Error");
                    $('div').css('background', '#f00');
                }
            });

        });
于 2012-07-09T10:12:39.310 に答える