【JavaScript 】DOMノードへのイベント定義にて、JavaScript 実行時エラー: 未定義または NULLとなる場合の対処
■今回の内容
JavaScript 実行時エラーで落ちたのでその対応をメモ
■内容
事象 :DOMノードへのイベント追加時に、JavaScript 実行時エラー: 未定義または NULLとなる場合の対処
理由 :DOMノードが定義する前にイベントを追加しようとしているため、イベントを追加するDOMが未定義でおちる
対処方法:読み込みが完了してから、処理を実行する
<script type="text/javascript"> //ここに記述すると上記のエラーとなる // var button = document.getElementById("TextBox1"); // button.addEventListener("click", test, false); document.onreadystatechange = function () { if (document.readyState == "loading") { console.log("loading"); } if(document.readyState=="interactive") { console.log("interactive"); } if (document.readyState == "complete") { //正しくはこっちに書く console.log("complete"); var button = document.getElementById("TextBox1"); button.addEventListener("click", test, false); } } function test(){ alert(""); }
参考:https://developer.mozilla.org/ja/docs/Web/API/Document/readyState
http://js.studio-kingdom.com/javascript/event_target/add_event_listener