Click here for free DL of the app version that can save data.

No:173

321

←

Prev Next

→

mental arithmetic game
Developer User2754｜Date and time 23/6/2 21:44:43
Build time 109.89 sec｜Game capacity 2.563KB｜

Script

mental arithmetic game

Answer the question.、Compete for the number of correct answers!

The problem is displayed

Number of correct answers: 0

←

Prev　Next

→ 　

Back　

[PR]現在のフィギュア売れ筋ランキング

Click here for free DL of the app version that can save data.

<!DOCTYPE html>
<html lang="ja">
<head>
	<meta charset="UTF-8">
	<title>暗算ゲーム</title>
</head>
<body>
	<h1>暗算ゲーム</h1>
	<p>問題に答えて、正解数を競おう！</p>
	<p id="problem">問題が表示されます</p>
	<form>
		<input type="number" id="answer" placeholder="Please input answer">
		<button type="button" onclick="checkAnswer()">答える</button>
	</form>
	<div id="result">正解数：0</div>

// 問題を作成する関数
		function createProblem() {
			const x = Math.floor(Math.random() * 10); // 0~9のランダムな整数
			const y = Math.floor(Math.random() * 10); // 0~9のランダムな整数
			const operator = ["＋", "－", "×", "÷"][Math.floor(Math.random() * 4)]; // 四則演算子のランダムな選択
			let ans; // 答えを格納する変数
			switch (operator) {
				case "＋":
					ans = x + y;
					break;
				case "－":
					ans = x - y;
					break;
				case "×":
					ans = x * y;
					break;
				case "÷":
					ans = x / y;
					break;
			}
			return `${x} ${operator} ${y} = ?`; // 問題文の文字列を作成して返す
		}

// 答えをチェックする関数
		function checkAnswer() {
			const ans = document.getElementById("answer").value;
			if (ans === "") {
				alert("答えを入力してください！");
				return;
			}
			const problem = document.getElementById("problem").textContent;
			const x = problem.substr(0, 1); // 式の最初の数値を取得
			const y = problem.substr(4, 1); // 式の2番目の数値を取得
			const operator = problem.substr(2, 1); // 式の演算子を取得
			let correctAns; // 正解の答えを格納する変数
			switch (operator) {
				case "＋":
					correctAns = Number(x) + Number(y);
					break;
				case "－":
					correctAns = Number(x) - Number(y);
					break;
				case "×":
					correctAns = Number(x) * Number(y);
					break;
				case "÷":
					correctAns = Number(x) / Number(y);
					break;
			}
			if (Number(ans) === correctAns) {
				counter++; // 正解数を1つ増やす
				document.getElementById("result").textContent = `正解数：${counter}`;
				document.getElementById("problem").textContent = createProblem(); // 次の問題を表示する
				document.getElementById("answer").value = ""; // 答えの欄を空にする
				alert("正解！");
			} else {
				alert("不正解...");
			}
		}

document.getElementById("problem").textContent = createProblem(); // 最初の問題を表示する
	</script>
</body>
</html>