イベントリスナーが即時実行されていた

1659 ワード
JavaScript イベントリスナー JavaScript テキストリンク

たいしたことないんだけど地味にはまってしたまったのでメモ。

イベントリスナーがクリックの時だけ動いていて欲しいのになぜかロードのタイミングで実行される

用意していたイベントリスナーは以下の通り。
クリックしたら動いてね～ってやつ。

【修正前】clickEventListener.js
document.addEventListener("click",displayAlert(),false);

呼び出している関数displayAlertは以下の通り。
呼び出されたらダイアログ表示しますってやつ。

displayAlert.js
function displayAlert(){alert("execute function")};

なんで思い通りに動いてくれないの？？？思っていたら、
displayAlertがJSが読み込まれた時点で実行されていただけでした。
なのでclickしたタイミングで動くように
displayAlert()の()を外してあげればOK。

【修正後】clickEventListener.js
document.addEventListener("click",displayAlert,false);

はい。想定通りのタイミングで動きました
JavaScript書き方に自由度があるところが難しい。