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 = デフォルト値;」とチェックして代入するような形で使うようにする。
関連記事
-
-
FileReader APIを用いて画像をアップロードせずにサムネイル表示
以前にFile APIを用いてファイル名やサイズ、形式(拡張子)を取得するメモを ...
-
-
「input type="number"」のテキストボックスを桁数制限且つ半角数値のみ入力可にする方法
「input type="number"」のテキストボックスに対して「2桁まで」 ...
-
-
ラジオボタンのカスタムデータ属性を取得し、特定の値の場合はチェックさせない方法
ASPを使用したサイトで特定のradioボタンは選択不可にしたいというケースがあ ...
-
-
サムネイルをクリックすると拡大画像を表示できる「Lightbox」の利用方法
画像をサムネイル表示してクリックしたら大きく表示する というのがLightbox ...
-
-
jQuery UIでテキストボックスにサジェスト(入力補助)機能を実装する方法
メールアドレスを入力するためのテキストボックスに文字を入力すると「@yahoo. ...