Question

我正在尝试循环访问AJAX，但令我惊讶的是我的循环无效。

for (var i = 0; i < lengthTotal; i++) {             
    $.ajax({
        dataType: "json",
        url: "{{action('ReportingController@getDailystats')}}/" + getCampaign[i] + "/" + getStartDates[i] + "/" + getEndDates[i]
    }).done(function(resultThree) {
        console.debug(i) //is always 2
        $(resultThree).each(function(index2, value2){ 
            barTable = [ getCampaignName, value2.impressions, value2.clicks ];
            xBYxTable($('tbody#stats'), barTable);
            //valueInside++;                                                                                
        }); // End resultthree
    });  //End Done 
}

Answer 1

这不是在循环内创建函数的最佳实践。

试试这个：

for (var i = 0; i < lengthTotal; i++) {
    (function (i) {
        $.ajax({
            dataType: "json",
            url: "{{action('ReportingController@getDailystats')}}/" + getCampaign[i] + "/" + getStartDates[i] + "/" + getEndDates[i]
        }).done(function (resultThree) {
            console.debug(i) //is always 2
            $(resultThree).each(function (index2, value2) {

                barTable = [getCampaignName, value2.impressions, value2.clicks];

                xBYxTable($('tbody#stats'), barTable);
                //valueInside++;                                                                                
            }); // End resultthree

        }); //End Done 
    })(i);
}

这项工作的原因是closures。即使在退出函数后，内部函数也可以访问外部函数的变量。这里，i循环内的for被更改，直到ajax的响应出现。通过使用closure，i被复制到函数的局部变量中。

Answer 2

我想以下几行让你陷入困境：

barTable = [getCampaignName,value2.impressions,value2.clicks];

您正在循环的每次迭代中覆盖此数组。因此，您将仅在最后一次迭代中获取值。如果想要追加，请尝试推送到此数组。

Answer 3

请在下面尝试，并确认ajax调用无循环工作。

    for (var i=0 ;i<lengthTotal;i++){ 
        performOperation(i);          
    }

    function performOperation(i)
    {
        $.ajax({
            dataType: "json",
            url: "{{action('ReportingController@getDailystats')}}/"+getCampaign[i]+"/"+getStartDates[i]+"/"+getEndDates[i]
        }).done(function(resultThree){
                console.debug(i) //is always 2
                $(resultThree).each(function(index2,value2){     
                       barTable = [getCampaignName,value2.impressions,value2.clicks];    
                       xBYxTable($('tbody#stats'),barTable);
                       //valueInside++;                                                                                
                 });// End resultthree

        });
    }

它可能对你有帮助。

Answer 4

这里的问题是异步的，您需要从函数执行ajax调用：

for (var i = 0; i < lengthTotal; i++) {
    (function (i) { // this is a self-executing anonnymus function
       // lace ajax here
    })(i);
}

你的问题很简单。您正在创建一个带变量i的循环。但是在th循环中你调用ajax调用-async。

不要说，你的循环在0,001ms迭代。而AJAX调用需要0.5毫秒。当AJAX将返回响应时，您的循环将结束，但i变量将已增加，并且其值将为2.

为避免这种情况，您需要将javascript调用包装在函数中并将i作为参数传递。那样i将被复制，并且在函数外增加它将不会影响它。

循环通过ajax调用

4 个答案: