onsen code monkey

個人的な日記とプログラミング備忘録です

【HTML】IEでHTML5の機能が使えなかった件

HTMLファイルをIEで開くとレイアウトが崩れていたりonInputやpattern等のイベントが発火しなかったりで謎だった。

丸一日ハマってしまったが、IEのドキュメントモードがIE7HTML5非対応)に設定されてたことが原因だった。

対策は非常に簡単で以下のメタタグをHTMLに追加すればよいだけ。

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

上記タグを追加することで最新のドキュメントモードを指定することができる。

注意したいのは、「閲覧者の環境でインストールされているIEの中の最新のバージョン」で表示するという点。

IE自体が古ければドキュメントモードを最新にしたところでHTML5の機能は使えないっぽい。
ちなみに"IE=edge"とあるけどMicrosoft Edgeとは関係ないらしい。

↓現在のドキュメントモードはF12で開発者ツールを開けば確認できる。
f:id:hitoto28:20180907140235p:plain