的jQuery：執行

Question

訂單繼是我的代碼：

$(document).on("click",".ball_link", function makeDiv(){ 
    function fetchLevels(){ 
     $.getJSON('fetch_level.php',{level: clicked_ball}, function(data) { 
     $.each(data, function(i,name) { 
       alert(name.level_id); //Line 1 
      }); 
     }); 
    } 
    fetchLevels(); 
    alert(name.level_id); //Line 2 
    while (//some condition){ 
     alert("hi 2"); //Line 3 
    } 
}); 

所需執行的順序：

線1

2號線（具有值相同，在1號線）

第3行

實際執行順序：

2號線（價值：未定義）

3號線

1號線（修正值）

如何控制這些線以獲得與正確的價值觀所需要的行執行的順序？

Answer 1

由於AJAX調用是異步要麼你移動在成功回調的所有代碼，或者你使用遞延對象來處理正確的執行順序

function fetchLevels() { 

    $.getJSON('fetch_level.php', { level: clicked_ball }) 

    .done(function(data) { 
     $.each(data, function(i,name) { 
      alert(name.level_id); //Line 1 
     }); 

     alert(name.level_id); //Line 2 
     while (//some condition) { 
      alert("hi 2"); //Line 3 
     } 
    }); 
} 

fetchLevels(); 

或者你也可以使用這個

function fetchLevels() { 
    return $.getJSON('fetch_level.php', { level: clicked_ball }) 
} 

$.when(fetchLevels()).done(function(data) { 
    $.each(data, function(i,name) { 
      alert(name.level_id); //Line 1 
    }); 

    alert(name.level_id); //Line 2 
      while (//some condition) { 
      alert("hi 2"); //Line 3 
     } 
    }); 
}) 

Answer 2

將第2行和第3行放入$.getJSON回調中，否則第1行在回調完成後異步執行，其餘部分同步執行。

Answer 3

getJSON是異步的。你想它的負荷發生後，一切都需要在回調：

$(document).on("click", ".ball_link", function makeDiv() { 
    $.getJSON('fetch_level.php', { 
     level: clicked_ball 
    }, function (data) { 
     $.each(data, function (i, name) { 
      alert(name.level_id); //Line 1 
     }); 

     fetchLevels(); 
     alert(name.level_id); //Line 2 
     while (//some condition){ 
      alert("hi 2"); //Line 3 
     } 
    }); 
}); 

Answer 4

與您的方案

通常情況下，你會打電話來阿賈克斯和使用成功的命令做你的處理，如：

$.ajax({ 
    url: myUrl, 
    dataType: 'json', 
    data: myData, 
    success: function(data) { 
    // do stuff here. 
    } 
}); 

如果你真的需要做你的代碼，就像你所說，你可以使用async: false，如：

$.ajax({ 
    url: myUrl, 
    dataType: 'json', 
    async: false, 
    data: myData, 
    success: function(data) { 
    // set variable here, then work with it outside the function 
    } 
});