発生している問題
初学者です。よろしくお願いします。スクールの課題にてタイマーを作成中です。
その過程で、途中まで問題が無いか確認しようとしましたが、、、。
下記ソースコードにてstartのボタンを押すとstart_countが処理されて、
1秒後には現在「はみがき」の箇所が.innerHTMLによって
「パスタ」に上書きされると思ったのですが何も起きません。
素人目で大文字だったりスペルミスが無いか確認したのですが、
エラーがどこで起こっているのか分かりません。
エラーの箇所とその理由、解決方法をお教え下さる方いらっしゃいましたら、
よろしくお願いします。
該当のソースコード
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <title>カウントダウンタイマー</title> <link rel="stylesheet" href="timer.css"> <script> var screen = document.getElementById("screen"); var interval_id; var start_flag = false; //スタート function start_count() { if (start_flag === false) { interval_id = setInterval(count_down, 1000); start_flag = true; } } //カウントダウン function count_down() { screen.innerHTML = "パスタ"; } //ストップ function stop_count() { clearInterval(interval_id); start_flag = false; } //リセット function reset_count() { } //ボタンのクリック監視 window.onload = function() { var start = document.getElementById("start"); start.addEventListener('click', start_count, false); var stop = document.getElementById("stop"); stop.addEventListener('click', stop_count, false); var reset = document.getElementById("reset"); reset.addEventListener('click', reset_count, false); } </script> </head> <body> <!-- タイマーの構造 --> <div id="frame"> <div id="screen">はみがき</div> <div id="button_3"> <button id="start">スタート</button> <button id="stop">ストップ</button> <button id="reset">リセット</button> </div> </div> <!-- //タイマーの構造 --> </body> </html>
###CSS
/*---------------------------------------*/ /*外枠のスタイル /*---------------------------------------*/ #frame { border: solid; height: 200px; width: 300px; margin: 0 50px; } /*---------------------------------------*/ /*表示部分 /*---------------------------------------*/ #screen { border: solid; height: 80px; margin: 20px; } /*---------------------------------------*/ /*ボタン /*---------------------------------------*/ #button_3 { /*border: solid;*/ text-align: center; margin: 20px; padding: 0; }
試したこと
・大文字、小文字の確認
・スペルミスの確認
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2018/09/08 16:55
2018/09/08 16:57
2018/09/08 17:23 編集