jquery ajax() zaman uyumsuz yanlış

Question

i ..

for(a=1;a<10;a++){ 
    $(".div").append("<div id="+a+"></div>") 
     $.ajax({ 
       url: "file.php", 
       data: "a="+a, 
       type: "POST", 
       async: false, 
       success: function(data) { 
       $("#"+a).html(data); 
       } 
     }); 

} 
$("div").click(function(){ 
     alert("it works"); 
}); 

sorun sorundur var: Öyle sadece son div olan file.php oradan async: false verilerine koymadı olduğu id 9 ile ama şimdi async: false var - veri vardır, böylece her iyi

yani div ama o ajax tarafından yükleme sırasında tıklayarak istiyorsanız çalışmıyor (sadece sonra bitmiş tüm ajax-es)

Bu sorunu nasıl çözebilirim? (Belki yanlış ben ajax kullanıyorum olmasıdır. Ben getJSON vb .. kullanabilirsiniz) kullanıcı ajax çağrı çalışırken arayüzü kullanmak mümkün olmasını istiyorsanız,

Answer 1

yardımcı olduğunuz için teşekkür

sayesinde async'nuzu true olarak değiştirmelidir. James Allardice tarafından, bu senaryoda, ajax çağrısının geri döndürülmesi için orijinal id'un değerini korumak için javascript kapaması kullanmanız gerektiği belirtilmiştir. Javascript kapatmalarıyla ilgili daha fazla bilgi için, how-do-javascript-closures-work numaralı telefonu inceleyin, burada stackoverflow üzerinde bulunan gerçekten iyi bir soru.

for(id = 1; id < 10; id++){ 
    $(".div").append("<div id='" + id + "'></div>"); 

    (function(id) { 
     $.ajax({ 
      url: "file.php", 
      data: "a=" + id, 
      type: "POST", 
      async: true, 
      success: function(data) { 
       $("#"+ id).html(data); 
      } 
     }); 
    }(id)); 
} 

Answer 2

Bunun için iyi bir çözüm, özyinelemeli bir işlev kullanmaktır.

function appendDivs(limit, count) { 
    count = count || 1; 
    if (count <= limit) { 
     $(".div").append("<div id=" + count + "></div>"); 
     $.ajax({ 
      url: "file.php", 
      data: "a=" + count, 
      type: "POST", 
      async: true, 
      success: function(data) { 
       $("#" + count).html(data); 
       appendDivs(limit, count + 1); 
      }, 
      error: function(e) { 
       alert('Error - ' + e.statusText); 
       appendDivs(limit, count + 1); 
      } 
     }); 
    } else { 
     return false; 
    } 
} 
appendDivs(10);