[jQuery] $(function)はonload後には効かない

JSライブラリで、DOM構築完了後に実行したい初期化コードがありまして、
$(function) みたいに最速タイミングで実行できる仕組みを探しております

・・・・

jQuery の $() の引数に初期化処理を行う関数とかの function を入れると、
  ・onLoad のタイミングで呼び出してくれる
  ・複数の初期化関数があっても、順に安全に実行できる
  ・$() だけなので、コード(文字数)が短くなる
だけでなくて、
  ・(ほとんどのブラウザで)実際に onLoad のイベントが発生するよりも
    先に関数を実行してくれるアクセラレーション機能が入っている
のもまた jQuery がクールと言われるポイントの1つ。
<script>
function init () {
     alert( "Hello, jQuery!" );
}
$( init );
</script>
という話は、去年の「まるごとJavaScript&Ajax!」などで書いた。

ところが、その $(function) での関数呼び出しは、DOM 構築完了前
(実際に onload のイベントが発生する前)でないと効かないんだね。

(A) DOM 構築完了前に実行される JavaScript 中で $(function) を呼び出す
    →onLoad 相当のタイミングで実行される
(B) DOM 構築完了前に実行される JavaScript 中で $(function) を呼び出した後、
  DOM 構築後に改めて $(function) を呼び出す
    →後者は即時に実行される
(C) DOM 構築完了前に実行される JavaScript 中で $(function) を呼び出さないまま
  DOM 構築後に初めて $(function) を呼び出す
    →スルーされる

C では、jQuery が DOM 構築完了したか否かを感知していないので、
イベント待ち状態となり、function が実行されない。(少なくとも Firefox では)
そもそも、$(function) 機能の目的は『Shortcut for document ready』であって、
初期化関数実行用ではないので、設計通りとも言える。(じゃあBは?)

具体的には、DOM 構築完了後に、script 要素を DOM ツリーに追加して、
そのソース中で $(function) した場合とかに、C の状態が発生する。
または、DOM 操作でなくても、確認用としては、以下のコードで再現可能。

<script>
function init () {
     alert( "Hello, jQuery!" );
}
function start () {
     $( init );
}
setTimeout( start, 1 );
</script>
C の状態でもスルーさせずに初期化関数を実行させる回避策はないかな。。。
予め $(function(){}); のダミー関数でも実行しておけば良いのだけど、意味ないか。
 


(追記)
amachangさん によると、
jQuery.event.special.ready.setup()
で行けるらしい。
ただし、Chrisさん によると、
たしかjQuery1.2.2から実装されたイベントAPIの一種なので、それ以前のバージョンのjQueryでは使えないので使うときはバージョンを要チェックです(ちがってたらゴメンナサイ)。
とのこと。
Thank you both!

ブログ気持玉

クリックして気持ちを伝えよう!

ログインしてクリックすれば、自分のブログへのリンクが付きます。

→ログインへ

なるほど(納得、参考になった、ヘー)
驚いた
面白い
ナイス
ガッツ(がんばれ!)
かわいい

気持玉数 : 15

なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー)
驚いた
面白い 面白い
ナイス
ガッツ(がんばれ!) ガッツ(がんばれ!)
かわいい

この記事へのコメント

この記事へのトラックバック