ChromeやFirefoxだと動くJavaScriptがIE(バージョン：11.228.17134.0)だけ動かないので調べてみた。
原因調査
IEの開発者ツールを起動するとエラーが3つ出ていました。
SCRIPT438: オブジェクトは ‘addEventListener’ プロパティまたはメソッドをサポートしていません。
jquery.min.js (3,147)
SCRIPT5007: プロパティ ‘$’ の値は Null または未定義で、Fuction オブジェクトではありません。
●●●.php (23,1)
SCRIPT1028: 識別子、文字列または数がありません。
●●●.php (46,3)
jQuerでエラーが出ているようなので調べてみると、互換性表示機能が悪さをしていることが分かりました。
解決方法
ユーザーが利用中のIEで、最新バージョンでの表示を強制するmetaタグ
|
1 |
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
|
これをヘッダに書くだけです。
|
1
2
3
4
5
6
7
8
9
10
11
12
|
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>動作テスト</title>
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
</head>
<body>
・
・
・
|
また、小ネタですが、jQuery等をURLから読み込む場合
src=”//ajax… のように http: や https: を省略し // から書き始めると、
ブラウザがhttp:とhttps:のどちらを使うか都合よく解釈してくれるそうです。