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

No:2753

3322

←

Prev Next

→

The game that cures dementia
Developer anonymous｜Date and time 23/6/22 14:29:50
Build time 26.558 sec｜Game capacity 2.239KB｜

Script

記憶トレーニングゲーム

スマホの画面をタップして、絵文字を見た後にボタンをタップして元の絵文字を当てよう！

←

Prev　Next

→ 　

Back　

[PR]現在の人気グッズランキング

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

<!DOCTYPE html>
<html>
<head>
	<title>記憶トレーニングゲーム</title>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<style>
		body {
			font-size: 2em;
			text-align: center;
		}
		button {
			font-size: 1em;
			padding: 1em;
			margin: 1em;
			border-radius: 1em;
			background-color: lightblue;
			border: none;
			cursor: pointer;
		}
	</style>
</head>
<body>
	<h1>記憶トレーニングゲーム</h1>
	<p>スマホの画面をタップして、絵文字を見た後にボタンをタップして元の絵文字を当てよう！</p>
	
	<div id="game" style="display:none">
		<h2>問題</h2>
		<p id="emoji"></p>
		<h2>解答</h2>
		<button id="btn1"></button>
		<button id="btn2"></button>
		<button id="btn3"></button>
		<button id="btn4"></button>
	</div>
	
	<div id="start">
		<button id="start-btn">スタート</button>
	</div>
	
	<script>
		const emojis = ["💩", "🍕", "🐶", "🐱", "🌻", "🎵", "🏀", "⚽"];
		let answer;
		let score = 0;
		
		function startGame() {
			document.getElementById("start").style.display = "none";
			document.getElementById("game").style.display = "block";
			nextQuestion();
		}
		
		function nextQuestion() {
			answer = Math.floor(Math.random() * 4) + 1;
			document.getElementById("emoji").innerHTML = emojis[Math.floor(Math.random() * emojis.length)];
			
			for (let i = 1; i <= 4; i++) {
				if (i === answer) {
					document.getElementById("btn" + i).innerHTML = document.getElementById("emoji").innerHTML;
				} else {
					document.getElementById("btn" + i).innerHTML = emojis[Math.floor(Math.random() * emojis.length)];
				}
				document.getElementById("btn" + i).addEventListener("click", checkAnswer);
			}
		}
		
		function checkAnswer(event) {
			if (event.target.id === "btn" + answer) {
				score++;
				alert("正解！現在のスコア：" + score);
				nextQuestion();
			} else {
				alert("不正解！終了です。最終スコア：" + score);
				document.getElementById("game").style.display = "none";
				document.getElementById("start").style.display = "block";
				score = 0;
			}
		}
		
		document.getElementById("start-btn").addEventListener("click", startGame);
	</script>
</body>
</html>