javascript - For loop continue looping only when a function inside is finish? -

here function first getting file list, each file, call ajax function execute something:

    function getimageslist(folder) {         $.ajax({             type:"post",             url: "getimglist.php",             data: {"data":folder},             datatype: "json",             success: function (data) {                 var isfirstloggingitem = "true";                 (var key in data) {                     //alert (data[key]);                     pdftoimgexec (data[key],isfirstloggingitem,folder,1);                     $('#pdftoimgresult').append('<p>processing ' + data[key] + ' <img src="loading.gif" height="20" width="20"/></p>');                     isfirstloggingitem = "false";                 }                 folder == 'incoming' ? getimageslist('result') : pdftoimgresult();             },             error: function(x, t, m) {                 $('#pdftoimgresult').html('<p>error</p>');                 alert (t);                 releasebtn();             }         });      } 

this callee function, contains ajax function execute something

    function pdftoimgexec(file,isfirstlogging,folder,round){             var poststring = file + '&' + isfirstlogging + '&' + folder;             $.ajax({                 type: "post",                 url: "pdftoimgexec.php",                 data: {"data":poststring},                 datatype: "html",                 success: function (data) {                     if (data) {                         $('#pdftoimgresult').html('').append('<p>finish processing ' + file + '</p>');                     } else if (!data && round < 4) {                         $('#pdftoimgresult').html('').append('<p>encounter error in processing ' + file + '  ， retrying ' + round + ' round </p>');                         round++;                         pdftoimgexec(file,isfirstlogging,folder,round);                     }                 },                 error: function(x, t, m) {                     $('#pdftoimgresult').html('errpr');                     alert (t);                     releasebtn();                 }             });      } 

in short, getimageslist function file list, each file , call pdftoimgexec function ajax staff. problem , not wait ajax staff finish start next loop .

that means , e.g. file1 running ajax staff => file1 finish ajax staff => file2 running ajax staff => file2 finish => check result

however, current situation file1 running ajax staff => file2 running ajax staff => check result => file1 finish / file2 finish

i have tried async:false, cache :false in both function seem no help, how fix it? thanks

use array store data

var dataarr=[]; 

in first function, push data array

function getimageslist(folder) {     $.ajax({         type:"post",         url: "getimglist.php",         data: {"data":folder},         datatype: "json",         success: function (data) {             dataarr = data;             doprocessdata();         },         error: function(x, t, m) {             $('#pdftoimgresult').html('<p>error</p>');             alert (t);             releasebtn();         }     });  } 

function doprocessdata this:

function doprocessdata(itemdonecallback, alldonecallback) {     if(typeof(itemdonecallback)==undefined)itemdonecallback=function(){};     if(typeof(alldonecallback)==undefined)alldonecallback=function(){};     if(arrdata.length>0){     var key = arrdata[0];             $.ajax({                  //option here function pdftoimgexec                  success: function (data) {                      arrdata.splice(0,1);//remove first data.                      doprocessdata();// call process next data.                      itemdonecallback(); // callback process thing                  }             })                     }else{        alldonecallback();// done callback     } } 

hope help!