jQueryの$(function)がwindow.onload後に効かない問題
病み上がり職場復帰のリハビリ代わりに、下記jQueryの$(function)の挙動をソースから追っかけてみました。
- [jQuery] $(function)はonload後には効かない Kawa.netブログ（川崎有亮）/ウェブリブログ
- jQuery の $(function) が ready イベント発生後だと動かない問題の解決法 - IT戦記
で、amachangの
jQuery.event.special.ready.setup()
/* または */
$.event.special.ready.setup()
は、たしかjQuery1.2.2から実装されたイベントAPIの一種なので、それ以前のバージョンのjQueryでは使えないので使うときはバージョンを要チェックです（ちがってたらゴメンナサイ）。
川崎さんが困っている、
具体的には、DOM 構築完了後に、script 要素を DOM ツリーに追加して、
そのソース中で $(function) した場合とかに、C の状態が発生する。
という現象は、そもそも普通に実行しちゃだめなのかなぁと思うのですが、どうなんだろう。
hoge()を$(hoge)と書かなければいけない理由が作られているアプリにあるのかな。
ソースを見ていて、
(C) DOM 構築完了前に実行される JavaScript 中で $(function) を呼び出さないまま
DOM 構築後に初めて $(function) を呼び出す
→スルーされる
こうなっちゃうのは、jQuery.ready()が実行されていないからで、強引に、
$.ready()
とかやっちゃえば使えるようになるんだけど、これもいまいちかな。
$(function)をDOM構築前に実行すると、以下のbindReady()が実行されて、最後にwindowがloadするタイミングでjQuery.ready()が実行されるようになっているから間違っちゃいないとは思うんだけども。うーむ。
function bindReady(){
if ( readyBound ) return;
readyBound = true;
// If Mozilla is used
if ( jQuery.browser.mozilla || jQuery.browser.opera )
// Use the handy event callback
document.addEventListener( "DOMContentLoaded", jQuery.ready, false );
// If Safari or IE is used
// Continually check to see if the document is ready
else (function(){
try {
// If IE is used, use the trick by Diego Perini
// http://javascript.nwbox.com/IEContentLoaded/
if ( jQuery.browser.msie || document.readyState != "loaded" && document.readyState != "complete" )
document.documentElement.doScroll("left");
} catch( error ) {
return setTimeout( arguments.callee, 0 );
}
// and execute any waiting functions
jQuery.ready();
})();
// A fallback to window.onload, that will always work
jQuery.event.add( window, "load", jQuery.ready );
}
