ほんとうに雑記帳になっています…。
○ 前置き
表示を高速化するため、非同期でファイルを読み込むことがあります。さらに複雑になると、複数の外部ファイルを読み込むことがでてきます。
外部ファイルで読み込んだ内容について、別の外部ファイルから参照したいとき参照元のファイルが読み込み完了(参照したいところの読み込みが完了)していなければなりません。そこで、それをチェックする方法をメモします。
○ コード
jQueryを利用している場合、以下のように記述すれば可能です。
1: setTimeout(function() {
2: if($("#jqueryObject").size() == 0) {
3: setTimeout(arguments.callee, 100);
4: }
5: else {
6: // 処理
7: }
8: }, 100);
○ 関数・プロパティの確認
・ setTimeout(code, delay)
delay(数値:ミリ秒)後にcodeを実行する。codeは関数または関数として評価できる文字列。IE4では文字列しかサポートしていません。
・arguments.calee
実行中の関数(自分)の参照
・その他
$("#jqueryObject").size()はjQueryオブジェクトのエレメント数を返すメソッドです。
○ 解説
1, 8行目のsetTimeoutで0.1秒後に無名関数(function()の括弧内)を実行します。
2行目のif文でjQueryオブジェクトを生成して、サイズを取り出します。ここで、サイズが0ならばオブジェクトが生成できなかったつまり読み込みが完了していないと判断できます。
3行目では読み込みが完了していなければもう0.1秒待って自分を呼び出します。つまり、0.1秒後もう一度2行目のif文を実行することになります。
jQueryオブジェクトが存在したならば、elseの処理にうつり6行目に行きます。ここに行いたい処理の関数を入れたり、または直接記述すれば目的は達成します。else文の時点ではすでに読み込みは完了しているので、存在しないオブジェクトにアクセスするという現象は起こりません。
○ その他
待ち時間を0.1秒としましたが、別段の理由はありません。妥当だと考えられる時間を入れればいいです。私は0.1秒が妥当であろうと判断し0.1秒で実装しました。
jQueryオブジェクトでやりましたが、存在を確認することができるならば何でも構わないと思います。たとえば変数とundefinedの比較など。参照したい物に応じて変える必要があると思います。