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

No:23308

←

Prev Next

→

暗算ゲーム
Developer User10799｜Date and time 23/10/29 20:20:58
Build time 88.906 sec｜Game capacity 2.557KB｜

Script

了解しました。以下に暗算ゲームのHTMLファイルの実装例を示します。

暗算ゲーム

このHTMLファイルをブラウザで実行すると、暗算ゲームが表示されます。問題が表示され、ユーザーは答えを入力して「答えを確認する」ボタンを押すことで正誤が表示されます。ゲームでは、問題を解いた後に次の問題が自動的に生成されます。なお、このプログラムはスマホでも遊ぶことが可能です。

←

Prev　Next

→ 　

Back　

[PR]現在の欲しいものランキング

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

了解しました。以下に暗算ゲームのHTMLファイルの実装例を示します。

```html
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>暗算ゲーム</title>
  <style>
    body {
      font-size: 50px;
      text-align: center;
    }
    button {
      font-size: 30px;
      padding: 10px 20px;
      margin: 20px;
      background-color: lightblue;
      border: none;
      border-radius: 5px;
    }
  </style>
</head>
<body>
  <h1>暗算ゲーム</h1>
  <p id="question"></p>
  <input type="number" id="answer" placeholder="答えを入力してください">
  <br>
  <button onclick="checkAnswer()">答えを確認する</button>
  <br>
  <p id="result"></p>
  
  <script>
    // 問題を生成する関数
    function generateQuestion() {
      var num1 = Math.floor(Math.random() * 10) + 1; // 1から10の乱数を生成
      var num2 = Math.floor(Math.random() * 10) + 1; // 1から10の乱数を生成
      var operator = getRandomOperator(); // +, -, ×, ÷ のいずれかをランダムに選択
      var question = num1 + operator + num2;
      document.getElementById("question").textContent = question;
    }
    
    // 演算子をランダムに選択する関数
    function getRandomOperator() {
      var operators = ["+", "-", "×", "÷"];
      var randomIndex = Math.floor(Math.random() * operators.length);
      return operators[randomIndex];
    }
    
    // 答えを確認する関数
    function checkAnswer() {
      var questionText = document.getElementById("question").textContent;
      var answer = eval(questionText); // evalで文字列を計算
      var userAnswer = parseInt(document.getElementById("answer").value); // 入力された答えを取得
      var result = document.getElementById("result");
      
      if (userAnswer === answer) {
        result.textContent = "正解！🎉";
      } else {
        result.textContent = "不正解...💔 正解は " + answer + " でした！";
      }
      
      // 次の問題を生成
      generateQuestion();
    }
    
    // ゲームを開始
    generateQuestion();
  </script>
</body>
</html>
```

このHTMLファイルをブラウザで実行すると、暗算ゲームが表示されます。問題が表示され、ユーザーは答えを入力して「答えを確認する」ボタンを押すことで正誤が表示されます。ゲームでは、問題を解いた後に次の問題が自動的に生成されます。

なお、このプログラムはスマホでも遊ぶことが可能です。