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

No:25806

52

プレイヤーが複数テキスト入力した食材を使った料理を考えてくれる手順も記載してくれる
Developer User12026｜Date and time 23/11/24 20:11:30
Build time 58.851 sec｜Game capacity 1.883KB｜

料理メーカー

食材を入力してください（カンマ区切り）：

→ 　

0　

0　

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

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

(C)2023 HisashiApp

<!DOCTYPE html>
<html>
<head>
  <title>料理メーカー</title>
</head>
<body>
  <h1>料理メーカー</h1>
  
  <label for="ingredients">食材を入力してください（カンマ区切り）：</label>
  <input type="text" id="ingredients">
  <button onclick="makeDish()">料理を作る</button>
  
  <h2 id="dishName"></h2>
  <ul id="steps"></ul>

<script>
    function makeDish() {
      var ingredientsInput = document.getElementById("ingredients").value;
      
      // 入力された食材をカンマで分割してリストに格納
      var ingredients = ingredientsInput.split(",");
      
      // ランダムに料理名を選ぶ
      var dishName = getRandomDishName();
      
      // 料理の手順を生成
      var steps = generateSteps(ingredients);
      
      // 料理名と手順を表示
      document.getElementById("dishName").innerText = "料理名：" + dishName;
      document.getElementById("steps").innerHTML = "";
      
      for (var i = 0; i < steps.length; i++) {
        var stepElement = document.createElement("li");
        stepElement.innerText = steps[i];
        document.getElementById("steps").appendChild(stepElement);
      }
    }
    
    function getRandomDishName() {
      var dishNames = ["ハンバーグ", "カレーライス", "オムライス", "ラーメン", "焼肉", "ピザ"];
      var randomIndex = Math.floor(Math.random() * dishNames.length);
      return dishNames[randomIndex];
    }
    
    function generateSteps(ingredients) {
      var steps = [];
      
      for (var i = 0; i < ingredients.length; i++) {
        steps.push("1. " + ingredients[i] + "を切る");
        steps.push("2. " + ingredients[i] + "を炒める");
      }
      
      steps.push("3. 全ての材料を混ぜる");
      steps.push("4. 完成！");
      
      return steps;
    }
  </script>
  
</body>
</html>