5秒以内に、選ばれた漢字の画数を当てるゲーム's game

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

No:22830

←

Prev Next

→

5秒以内に、選ばれた漢字の画数を当てるゲーム
Developer バファリンヌ｜Date and time 23/10/25 20:09:43
Build time 57.185 sec｜Game capacity 3.254KB｜

Script

←

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">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>漢字の画数当てゲーム</title>
    <style>
        body {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            height: 100vh;
            font-size: 24px;
        }
        
        #question {
            margin-bottom: 20px;
            font-size: 36px;
        }
        
        #answer-input {
            width: 200px;
            height: 40px;
            font-size: 24px;
            text-align: center;
        }
        
        #result-message {
            font-size: 24px;
        }
    </style>
</head>
<body>
    <div id="question"></div>
    
    <input type="number" id="answer-input" min="0" placeholder="画数を入力">
    
    <div id="result-message"></div>
    
    <script>
        // 漢字のリスト
        const kanjiList = [
            { kanji: "木", count: 4 },
            { kanji: "牛", count: 4 },
            { kanji: "王", count: 4 },
            { kanji: "金", count: 8 },
            { kanji: "魔", count: 21 },
            { kanji: "日", count: 4 },
            { kanji: "月", count: 4 },
            { kanji: "田", count: 5 },
            { kanji: "女", count: 3 },
            { kanji: "男", count: 7 }
        ];
        
        // ゲームの初期化
        function initGame() {
            // 問題の漢字をランダムに選択
            const questionIndex = Math.floor(Math.random() * kanjiList.length);
            const question = kanjiList[questionIndex].kanji;
            const correctAnswer = kanjiList[questionIndex].count;
            
            // 問題を表示
            document.getElementById("question").textContent = question;
            
            // 入力欄を初期化
            const answerInput = document.getElementById("answer-input");
            answerInput.value = "";
            answerInput.focus();
            
            // 結果メッセージを初期化
            document.getElementById("result-message").textContent = "";
            
            // 入力された画数が正解か判定
            function checkAnswer() {
                const userAnswer = Number(answerInput.value);
                
                if (userAnswer === correctAnswer) {
                    document.getElementById("result-message").textContent = "正解！🎉";
                } else {
                    document.getElementById("result-message").textContent = "不正解！😢";
                }
                
                // ゲームを再開
                setTimeout(initGame, 2000);
            }
            
            // 入力欄でEnterキーが押された時に回答をチェック
            answerInput.addEventListener("keydown", function(event) {
                if (event.key === "Enter") {
                    checkAnswer();
                }
            });
        }
        
        // ゲームの開始
        initGame();
    </script>
</body>
</html>