最近はjQueryMobileをつかってhtml5/css3でウェブアプリを作っている。 jQuery Mobileは通常のhtmlをマークアップするだけで、それらしいモバイルサイトが作れる。 とても便利なのだが、前々から$(document).ready()がうまく動かないと感じていた。 以下はその調査と解決の記録である。 htmlを分割すると遷移先の画面で$(document).ready()が動かない 現象としてはhtmlが2つ以上ある場合に、遷移先のhtmlヘッダに記述された$(document).ready()が動作しない。 確実な原因はわからないのだが、デバッグしてみるとどうもjQueryMobileの仕様のようである。 ページ遷移をする際に、新しくhtmlを読み込むのではなく、既存のhtmlにdiv要素だけ挿入しているようなのである。 分かりにくのでスクリーンショットを貼った