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

No:23944

132

←

Prev Next

→

アナグラムクイズ
Developer バファリンヌ｜Date and time 23/11/4 16:15:37
Build time 73.592 sec｜Game capacity 4.179KB｜

Script

了解しました。以下はアナグラムクイズの実装例です。

アナグラムクイズ

上記のコードは、アナグラムクイズのゲームを実装したものです。ページを開くと最初の問題が表示され、ユーザーは回答を入力してボタンをクリックします。正解すると次の問題が表示され、全問題終了後に「全問題終了しました。」と表示されます。不正解の場合は、再度回答を試みるように促されます。ご確認ください。

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋グッズランキング

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

了解しました。以下はアナグラムクイズの実装例です。

```html
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Anagram Quiz</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            text-align: center;
        }

h1 {
            margin-top: 50px;
        }

#word {
            font-size: 30px;
            margin: 40px;
        }

#answer {
            font-size: 24px;
            width: 200px;
            margin-bottom: 20px;
        }

#button {
            font-size: 24px;
            padding: 10px 20px;
        }

#result {
            margin-top: 40px;
            font-size: 24px;
        }
    </style>
</head>
<body>
    <h1>アナグラムクイズ</h1>
    <div id="word"></div>
    <input type="text" id="answer" placeholder="答えを入力">
    <br>
    <button id="button" onclick="checkAnswer()">回答する</button>
    <div id="result"></div>

// 問題のインデックス
        var currentQuizIndex = 0;

// 画面の要素を取得
        var wordElement = document.getElementById('word');
        var answerElement = document.getElementById('answer');
        var resultElement = document.getElementById('result');

// ゲームの開始
        function startGame() {
            showQuiz();
            answerElement.value = '';
            resultElement.innerHTML = '';
        }

// 問題を表示
        function showQuiz() {
            var currentQuiz = quizzes[currentQuizIndex];
            wordElement.textContent = shuffleString(currentQuiz.word);
            answerElement.placeholder = currentQuiz.hint;
        }

// 文字列をシャッフル
        function shuffleString(str) {
            var shuffledStr = '';
            var arr = str.split('');

while (arr.length > 0) {
                var randomIndex = Math.floor(Math.random() * arr.length);
                shuffledStr += arr[randomIndex];
                arr.splice(randomIndex, 1);
            }

return shuffledStr;
        }

// 回答のチェック
        function checkAnswer() {
            var currentQuiz = quizzes[currentQuizIndex];
            var userInput = answerElement.value.trim();

if (userInput.toLowerCase() === currentQuiz.answer) {
                resultElement.textContent = '正解！';
                currentQuizIndex++;
                if (currentQuizIndex === quizzes.length) {
                    resultElement.textContent += ' 全問題終了しました。';
                    document.getElementById('button').disabled = true;
                } else {
                    showQuiz();
                }
            } else {
                resultElement.textContent = '不正解！もう一度試してみてください。';
            }
        }

// ゲームの開始
        startGame();
    </script>
</body>
</html>
```

上記のコードは、アナグラムクイズのゲームを実装したものです。ページを開くと最初の問題が表示され、ユーザーは回答を入力してボタンをクリックします。正解すると次の問題が表示され、全問題終了後に「全問題終了しました。」と表示されます。不正解の場合は、再度回答を試みるように促されます。

ご確認ください。