あなた$.get
は非同期です。つまり、コードの残りの部分の後で終了するため、その関数内の body 変数への影響はわかりません。代わりに、成功のコールバック関数は、この関数が既に終了してからかなり後に呼び出されます。
ここにあるように複数の非同期 ajax 呼び出しをチェーンするには、非同期 ajax 呼び出しはシーケンシャルではないため、通常のシーケンシャル プログラミングを使用することはできません。ネットワーク リクエストが送信されると、JavaScript が実行を継続し、しばらくしてレスポンスが到着すると、成功ハンドラが呼び出されて実行されます。
あなたが持っているように連続した ajax 呼び出しを実行するには、成功ハンドラー内で作業をネストして、応答を使用する唯一のコードが実際に成功ハンドラーにあるようにする必要があります。擬似コードでは、次のようになります。
$.get(..., function(data) {
// operate on the results only in here
// a second ajax function that uses the data from the first
// or adds onto the data from the first
$.get(..., function(data) {
// now finally, you have all the data
// so you can continue on with your logic here
});
// DO NOT PUT ANYTHING HERE that uses the responses from the ajax calls
// because that data will not yet be available here
});
次のようなことを行うことはできません。
var myVariable;
$.get(..., function(data) {
// add something to myVariable
});
$.get(..., function(data) {
// add something to myVariable
});
$.get(..., function(data) {
// add something to myVariable
});
// do something with myVariable
これらの ajax 呼び出しは、関数の終了前に完了していません。最初の例のようなデザイン パターンに従う必要があります。
より高度なツールの場合、ajax 呼び出しが完了した後に実行するコードを定義する別の方法であるjQuery deferredをいつでも使用できます。最初のコード例と同じようにコードを実行するようにスケジューリングしているだけですが、これはシーケンシャル プログラミングに少し似ています。