jQueryで処理を順番に記述しても、先の処理が終了する前に次の処理に入ることが多々ありますがこれを解消する方法を紹介します。

jQuery 処理の順番

通常は先に記述した処理から順番に開始していきますが、処理に時間がかかる場合、終了間に次の処理が走ってしまします。

下記の例の場合、test01Script()の処理が完了後、「完了しました」のアラートを出力したいのですが、test01Script()の処理に時間がかかると、test01Script()の処理が完了前にアラートが出力されます。

$.when().done() を利用する

上記の例のように処理が完了してからアラートを出力したいなどの場合は$.when().done()を利用することで解決します。

これでtest01Script()（1番目の処理）の処理が完了後に、alert()（2番目の処理）が出力されます。