前提・実現したいこと
現在暗算ゲームを作成していて、レベル1を選択してスタートを押すとタイマーが機能するのですがレベル2又はレベル3を選択してボタンを押すとタイマーが機能しません。原因がわかる方よろしくお願いいたします。
該当のソースコード
javascript
1document.addEventListener("DOMContentLoaded",function(){ 2var text1 = document.getElementById('text1'); 3var text2 = document.getElementById('text2'); 4var start = document.getElementById('start'); 5var level1random1 = Math.floor(Math.random()*10)+1; 6var level1random2 = Math.floor(Math.random()*10)+1; 7var level2random1 = Math.floor(Math.random()*100)+1; 8var level2random2 = Math.floor(Math.random()*100)+1; 9var level3random1 = Math.floor(Math.random()*1000)+1; 10var level3random2 = Math.floor(Math.random()*1000)+1; 11var kaitou = document.getElementById('kaitou'); 12var ans; 13var kai; 14var cnt=0; 15var level = document.getElementsByName( "level" ) ; 16var a; 17 18 19 20start.addEventListener('click',function(){ 21 22 for ( a="", i=level.length; i--; ) { 23 if (level[i].checked ) { 24 a = level[i].value ; 25 break ; 26 } 27 } 28 if(a === "level1"){ 29 text1.value = level1random1; 30 text2.value = level1random2; 31 ans = level1random1+level1random2; 32 }else if(a === "level2"){ 33 text1.value = level2random1; 34 text2.value = level2random2; 35 ans = level2random1+level2random2; 36 }else{ 37 text1.value = level3random1; 38 text2.value = level3random2; 39 ans = level3random1+level3random2; 40 } 41}); 42kaitou.addEventListener('input',function(){ 43 kai = kaitou.value; 44 if(kai == ans && a === "level1"){ 45 var lv1no1 = Math.floor(Math.random()*10)+1; 46 var lv1no2 = Math.floor(Math.random()*10)+1; 47 text1.value = lv1no1; 48 text2.value = lv1no2; 49 ans = lv1no1+lv1no2; 50 cnt++; 51 }else if(kai == ans && a === "level2"){ 52 var lv2no1 = Math.floor(Math.random()*100)+1; 53 var lv2no2 = Math.floor(Math.random()*100)+1; 54 text1.value = lv2no1; 55 text2.value = lv2no2; 56 ans = lv2no1+lv2no2; 57 cnt++; 58 } 59 }); 60 var count = 60; //カウントダウンの数字を格納 61 var min = 0; //分 62 var sec = 0; //秒 63 var stp = null; 64 var i = 0; 65 66 67 function count_start(){ 68 i++; 69 if(i === 1){ 70 stp = setInterval(count_down,1000); 71 } else { 72 73 i = 0; 74 } 75 } 76 77 //カウンドダウン表示 78 function count_down(){ 79 if(count === 1){ 80 var timer = document.getElementById("timer"); 81 timer.innerHTML = "あなたの"+cnt+"問解けました。"; 82 alert("TIME UP"); 83 clearInterval(stp); 84 } else { 85 count--; 86 min = parseInt(count / 60); 87 sec = count % 60; 88 var count_down = document.getElementById("timer"); 89 count_down.innerHTML = ("0"+min).slice(-2) +":" + ("0"+sec).slice(-2); 90 91 } 92 } 93 94 //ストップボタンクリック時のアクション 95 function count_stop(){ 96 clearInterval(stp); 97 i = 0; 98 } 99 100 //リセットボタンクリック時のアクション 101 function count_reset(){ 102 count = 60; 103 min = parseInt(count / 60); 104 sec = count % 60; 105 i = 0; 106 var count_down = document.getElementById("timer"); 107 count_down.innerHTML = ("0"+min).slice(-2) +":" + ("0"+sec).slice(-2); 108 text1.value = ""; 109 text2.value = ""; 110 } 111 112 //ボタンイベント制御 113 var start = document.getElementById('start'); 114 var stop = document.getElementById("stop"); 115 var reset = document.getElementById("reset"); 116 start.addEventListener('click',count_start); 117 stop.addEventListener("click",count_stop); 118 reset.addEventListener("click",count_reset); 119 120 121 122 123 124 125});
html
1<!DOCTYPE html> 2<html lang="ja"> 3<head> 4 <meta charset="UTF-8"> 5 <title>暗算ゲーム</title> 6 <link rel="stylesheet" href="style.css"> 7 <script src="anzan.js"></script> 8</head> 9<body> 10 <h1>暗算ゲーム</h1> 11 <p id="timer">01:00</p> 12 <input type="radio" name="level" value="level1">レベル1 13 <input type="radio" name="level" value="level2">レベル2 14 <input type="radio" name="level" value="level3">レベル3 15 <input type = "button" value = "スタート" id="start" > 16 <button id="stop">ストップ</button> 17 <button id="reset">リセット</button> 18 19 <table cellpadding="1"> 20 <tr> 21 <td><input type="text" id = "text1" style="text-align:right"></td> 22 <td align="left" width="2"><font size="+2">+</font></td> 23 <td align="right"><input type="text" id = "text2" style="text-align:right"></td> 24 </table> 25 <p>解答</p> 26 <input type="text" id = "kaitou" style="text-align:right"> 27 28 29 30 31 32</body> 33</html>
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2021/08/12 04:28