Question

在下面的代码中，我尝试在loop_the_table完成后运行ajax_call函数。我的代码是：

function ajax_and_loop(){    

      ajax_call(function(){ loop_the_table();});
}    
   function ajax_call(callback){

     $(document).ready(function(){
         $.getJSON('php_side.php', function(data) {
           $(data).each(function(key, value) {
               value = value.toString();
               res = value.split(',');
               array_of_people_already_suscribed[row][column++] = res[0];
               array_of_people_already_suscribed[row][column++] = res[1];
               array_of_people_already_suscribed[row][column] = res[2];
               row++;
               column = 0;
           });
         });
         if (typeof callback === "function") {
         callback();
         }
       });
     }

       function loop_the_table(){
          console.log("The row is "+row);
         for(var i = 0; i < row; i++){

                   console.log("kalispera oli mera");
             console.log(array_of_people_already_suscribed[i][0]);
             console.log(array_of_people_already_suscribed[i][1]);
             console.log(array_of_people_already_suscribed[i][2]);
           }  
        }

从ajax_and_loop调用Cosnidering index.html，代码出了什么问题？（在调用ajax_call之前，它没有完成第一个loop_the_table函数。

Answer 1

将callback()移至$.getJSON()

function ajax_and_loop(){    

      ajax_call(function(){ loop_the_table();});
}    
   function ajax_call(callback){

     $(document).ready(function(){
         // getJSON is an async function, it will not finish before your code continues
         // executing.
         $.getJSON('php_side.php', function(data) {
           $(data).each(function(key, value) {
               value = value.toString();
               res = value.split(',');
               array_of_people_already_suscribed[row][column++] = res[0];
               array_of_people_already_suscribed[row][column++] = res[1];
               array_of_people_already_suscribed[row][column] = res[2];
               row++;
               column = 0;
           });
           // place callback HERE in order to fire after the async function has finished.
         });
         // Placing callback here does not work as intended because the callback is called
         // before your async function finished executing.
         if (typeof callback === "function") {
         callback();
         }
       });
     }

       function loop_the_table(){
          console.log("The row is "+row);
         for(var i = 0; i < row; i++){

                   console.log("kalispera oli mera");
             console.log(array_of_people_already_suscribed[i][0]);
             console.log(array_of_people_already_suscribed[i][1]);
             console.log(array_of_people_already_suscribed[i][2]);
           }  
        }

Answer 2

代码有什么问题？（它在调用loop_the_table之前没有先完成ajax_call函数）

在您收到data - $.getJSON is asynchronous来呼叫其回拨之前，您已经执行了callback()。您需要将$.getJSON来电移至function ajax_and_loop(){ $(document).ready(function(){ ajax_call().then(loop_the_table); }); } function ajax_call(callback){ return $.getJSON('php_side.php').then(function(data) { var array_of_people_already_suscribed = […]; $(data).each(function(key, value) { var res = value.toString().split(','); var column = 0; array_of_people_already_suscribed[row][column++] = res[0]; array_of_people_already_suscribed[row][column++] = res[1]; array_of_people_already_suscribed[row][column] = res[2]; row++; }); return array_of_people_already_suscribed; }); } function loop_the_table(array_of_people_already_suscribed) { var row = array_of_people_already_suscribed.length; console.log("The row is "+row); for (var i = 0; i < row; i++){ console.log("kalispera oli mera"); console.log(array_of_people_already_suscribed[i][0]); console.log(array_of_people_already_suscribed[i][1]); console.log(array_of_people_already_suscribed[i][2]); } }回调。

尽管从函数中返回一个承诺会更好：

UserDetailsService

使用回调使两个函数一个接一个地运行

2 个答案: