JQuery .done timing

Question

У меня есть следующий код - он предназначен для динамического построения списка ссылок на другие вещи, основанные на запросе sql. Запись в sql содержит поле, сформированное как «itemX, itemY, Recipe - Z», где этот последний элемент является необязательным - код передает каждый элемент списка в другой sql-запрос и когда он загружается в последнем (и получает значение null) он должен был просто распечатать этот кусок. Вместо этого, когда я его запускал, я продолжал получать элемент до того, который я хочу. Проблема устраняется добавлением от 1 до z, но я хочу знать, почему он это делает.

$("#components").html("<span>BUILDS FROM</span>"); 
var componentslist = data[9].split(", "); 
for (var z = 0; z < componentslist.length; z++){ 
    $.getJSON("items.php", {item:componentslist[z]}).done(function(internald){ 
    if(internald === null){ 
     $("#components").append("<br\><span>"+componentslist[z+1]+"</span>"); 
    } else { 
     $("#components").append("<br\><span class=\"crosslink\" title=\""+internald[0]+"\">"+internald[1]+" - "+internald[2]+"</span>"); 
    } 
    }); 
} 

Таким образом, если данные [9] является

"item3, item4, Рецепт - 5г"

он будет запрашивать эти элементы и выплюнуть

«Пункт 3 - 1 г, Пункт 4 - 2g, Рецепт - 5г»

но если на nullcase я просто использовал componentslist [г] было бы сказать

«Пункт 3 - 1 г, пункт 4 - 2 г, item4»

, даже если в этот момент в петле г должен быть 2, а не 1.

Answer 1

Это классическая проблема с закрывающим использованием переменного

$("#components").html("<span>BUILDS FROM</span>"); 
var componentslist = data[9].split(", "); 
for (var z = 0; z < componentslist.length; z++){ 
    (function(idx){ 
     $.getJSON("items.php", {item:componentslist[idx]}).done(function(internald){ 
      if(internald === null){ 
       $("#components").append("<br\><span>"+componentslist[idx+1]+"</span>"); 
      } else { 
       $("#components").append("<br\><span class=\"crosslink\" title=\""+internald[0]+"\">"+internald[1]+" - "+internald[2]+"</span>"); 
      } 
     }); 
    })(z) 
}