Internet ExplorerでJavaScript関数の初期値について
2024/02/25
あるJavaScriptの関数でchromeやfirefoxは正常に動いたけどIE11のみ動かないという現象が発生した。F12キーで開発者ツールからコンソールを確認しましたところ「')'がありません」との表示がされ、さらにその関数を動かすと「'関数名'は定義されていません。」と表示された。
症状
aタグリンクからonclickでtest_func関数を動かしたとする。ソースとしては以下のようなもの。
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>title</title>
</head>
<body>
<a href="javascript:void(0);" onclick="return test_func(1)">test</a>
<script>
function test_func( score, flg = true ){
if( flg ){
alert(1);
}
}
</script>
</body>
</html>
これをchromeやfirefoxではaタグを叩くと「1」のアラートが表示されるが、IE11では何も動作しなかった。コンソールを追うとページを開いた時点で「')'がありません」と表示、aタグを叩くと「test_funcは定義されていません。」と表示された。
原因
明確な原因は正直分からなかったんだけど、関数の初期値(デフォルト引数)がひっかかっているっぽい。初期値を設定せず、またonclickで関数を叩く際に引数をきちんと渡すと正常に動いた。以下のような形。
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>title</title>
</head>
<body>
<a href="javascript:void(0);" onclick="return test_func(1, true)">test</a>
<script>
function test_func( score, flg ){
if( flg ){
alert(1);
}
}
</script>
</body>
</html>
その他
JavaScriptでデフォルト引数を使うのは遠慮しておいた方が良さそう。使うとしても関数の中で「if(typeof param === 'undefined') param = デフォルト値;」とチェックして代入するような形で使うようにする。
関連記事
-
-
架空の地図画像をLeafletを用いてWeb上でマップ表示する方法
ゲーム攻略サイト等でゲーム内の地図をWeb上で表示し、マーカーを立てたりマウスホ ...
-
-
IE&javascriptの予約語
前にもひっかかった問題で、今日同じことで 時間をとられたのでメモ。 予約語？ っ ...
-
-
jQueryからAjax経由でPHPにリクエストしCookieを操作する方法
先日PHPでCookie保存時にHttpOnly / Secure属性を設定する ...
-
-
jQuery Nice Selectを特定ページのみ無効にする方法
bootstrap系のテンプレートデザインを使用したサイトを構築中に、セレクトメ ...
-
-
JavaScriptでダミー画像(プレースホルダー画像)を表示する「Holder.js」ライブラリの利用方法
サイトの開発段階で「本番用の画像はまだ用意できていない」等の理由によりダミー画像 ...