for循环不会等到ajax响应到来。

Question

在for循环中，正在进行ajax调用。 for循环直到ajxa调用获得响应才等待，它将值增加到加一，因此响应不会更新到其相应的div。

示例：我的ID为divid0，divid1，divid2，divid3，divid4 ........ divid的div的编号为'N' 。
在循环中（for（var i = 0; i <n; i ++））第一个'i'值为零，我需要将我的第一个ajax响应更新为id为"divid0" div，但是直到我得到ajax响应在循环中， 'i'增加到一个，因此我的第一个ajax响应更新为id为"divid1"而不是"divid0" div。

我使用ajax同步调用解决了此问题，但是问题是我无法将页面拖到底部，直到完全加载页面为止。 我的网页包含大约10个滑块，因此完全加载要花费一个多分钟的时间，只有用户才能查看该页面。 所以我希望用户即使在页面加载时也要拖到页面底部（至少加载一个滑块之后）。

在此先感谢，这是我的代码

for(var sliderId=0; sliderId < 6; sliderId++){ 
    $.get('api url', {}, function(response){
        if(!response){ 
            $("#slider"+sliderId).html('Currently there is no items in this category');
        } else{
            if((response.results) && (response.results.length > 0)){
                getInfo(response, sliderId);
            }        
        }                
    });     
}

Answer 1

您也可以使用此递归方法获得结果

 var sliderId = 0;
function recursive1(sliderId)
{
  $.get('api url', {}, function(response){
    if(!response){ 
        $("#slider"+sliderId).html('Currently there is no items in this category');
    } else{
        if((response.results) && (response.results.length > 0)){
            getInfo(response, sliderId);

        }        
    }  
    if(sliderId < 6)
               recursive(sliderId++)              
});     
}
recursive1(0)

Answer 2

问题是，所有响应中的“ sliderId”都引用相同的变量。 由于在for循环完成之前未调用回调，因此'sliderId'对于所有响应调用都将具有值'6'。 您可以通过为每个ajax调用引入一个新作用域来解决此问题（例如MMK建议）。

例如：

for(var sliderId=0; sliderId < 6; sliderId++) {
 updateDiv(sliderId);
}

function updateDiv(sid) {
  $.get('api url', {}, function(response){
    if(!response){ 
        $("#slider"+sid).html('Currently there is no items in this category');
    } else{
        if((response.results) && (response.results.length > 0)){
            getInfo(response, sid);
        }        
    }                
  }); 
}