InternetExplorer8の互換表示をオフにするとJavaScriptが動作しない

Home>Information>InternetExplorer8の互換表示をオフにするとJavaScriptが動作しない

この情報はお役に立ちましたか？よろしければ皆様にもお知らせください。

  このエントリーをはてなブックマークに追加 mixiチェック  

InternetExplorerは、8になるまではHTMLに独自の解釈を行っており、厳密なHTMLのルールを無視して、アバウトなソースであっても、ちゃんと表示させるようにつくられてきました。
InternetExplorer8になって、このアバウトな解釈を避け、より正確にHTMLの記述を求めるようになりました。そのため、正確に記述されていないHTML文書は、きちんと表示されなくなるようになりました。

これにより、今まできちんと動作していたにも関らず、ブラウザを変更したら動作しなくなった、という現象が起きるようになりました。

応急措置

緊急避難的にこの問題を回避するには、以下の方法を試してください。

ウェブページを見る場合

普段見ているウェブサイトの表示がおかしくなった場合は、InternetExplorer8の、「ツール」→「互換表示」をクリックして、チェックを入れます。
また、「ツール」→「互換表示設定」で、「互換表示ですべてのWebサイトを表示する」にチェックを入れると、すべてのウェブサイトに互換表示が適用されます。

互換表示とは、InternetExplorer7以前の、IEによるHTMLの独自解釈で表示する、という意味です。

ウェブページを見せる場合

自分で作成したウェブページを、ユーザに対して互換表示で見せたい場合には、head要素内に、以下のように記述します。

<meta http-equiv="X-UA-Compatible" content="IE=emulateIE7">

→詳しくは「HTML：META要素」の「InternetExlorerのレンダリングモードを指定する」をご覧下さい。

根本的な解決

以上の対処により、以前と同じ動作を確保できます。
しかし、互換表示はIE独自の解釈のまま表示する、ということですから、今後、この機能がなくなる可能性は十分にあります。また、IE以外のブラウザ（GoogleChromeやFirefox、Operaなど）では、そもそも動作しない、という可能性もあります。

そこで、まずは上記の応急措置をとっておき、その後、根本的な改善を行うことをお薦めします。

根本的な改善とは、正しいHTMLで記述することにほかなりません。
正しいHTMLで書けば問題なくHTMLは表示されるし、JavaScriptも動作します。

一例ですが、<input type="hidden" value="値">をbody要素内に配置して、JavaScriptに渡す値を格納させている場合、IEの互換モードでは動作しますが、非互換モードや他のブラウザでは動作しません。
input要素は、form要素内に配置されていなければならない、というルールがあるためです。
このようなHTML上の問題を確認するには、HTML文書の文法をチェックするサイトなどを活用するとよいでしょう。

→「Another HTML-lint gateway」（HTML文書の文法チェックと改善提案をするサイト）AnotherHTML-lint gatewayを別ウィンドウで開く

関連リンク

よく読まれている記事

UpDate:2009-12-9