不在JS数字游戏中显示输出。

huangapple
go评论108阅读模式
英文:

Not displaying output in JS number game

问题

以下是您代码的翻译部分：

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7.     <title>随机数游戏</title>
  8. </head>
  9. <body>
  10.     <div>
  11.         <h1>猜一个随机数！</h1>
  12.         <input type="text" id="input" placeholder="在此输入猜测！"><br>
  13.         <button onclick="displayOutput()">提交</button>
  14.         <p>在上方的空格中输入1到100之间的数字，看看你是否猜对了。</p>
  15.         <span id="output"></span>
  16.     </div>
  18.     <script>
  19.         function displayOutput() {
  20.             let inputValue = document.getElementById("input").value;
  21.             let randomNumber = Math.floor(Math.random() * 100) + 1;
  23.             if (inputValue == null || inputValue == "") {
  24.                 document.getElementById("output").innerHTML = "你必须输入1到100之间的值。";
  25.             } else if (inputValue != randomNumber) {
  26.                 document.getElementById("output").innerHTML = "你的猜测不正确。再试一次。";
  27.             } else {
  28.                 document.getElementById("output").innerHTML = "你猜对了！你的数字是 " + inputValue + "，做得好。";
  29.             }
  30.         }
  31.     </script>
  32. </body>
  33. </html>

请注意，我已经修复了代码中的几个错误，包括随机数生成方式和条件语句的语法。希望这可以帮助您让您的随机数游戏正常运行。如果您还有其他问题，请随时提出。

英文:

I'm a student and I'm doing an assignment for my coding class which involves me making a random number game that asks the user for input and then display the output. So far my code looks like this. We just started conditionals and I'm unsure about a couple of things.

  1. &lt;!DOCTYPE html&gt;
  2. &lt;html lang=&quot;en&quot;&gt;
  3. &lt;head&gt;
  4.     &lt;meta charset=&quot;UTF-8&quot;&gt;
  5.     &lt;meta http-equiv=&quot;X-UA-Compatible&quot; content=&quot;IE=edge&quot;&gt;
  6.     &lt;meta name=&quot;viewport&quot; content=&quot;width=device-width, initial-scale=1.0&quot;&gt;
  7.     &lt;title&gt;Random Number Game&lt;/title&gt;
  9.     &lt;/style&gt;
  10. &lt;/head&gt;
  11. &lt;body&gt;
  12.     &lt;div&gt;
  13.         &lt;h1&gt;Guess a random number!&lt;/h1&gt;
  14.         &lt;input type=&quot;text&quot; id=&quot;input&quot; placeholder=&quot;Type guess here!&quot;&gt;&lt;br&gt;
  15.         &lt;button onclick=&quot;displayOutput()&quot;&gt;Submit&lt;/button&gt;
  16.         &lt;p&gt;Type in a number 1 - 100 in the space above and see if you were right or not.&lt;/p&gt;
  17.         &lt;span id=&quot;output&quot;&gt;&lt;/span&gt;
  18.     &lt;/div&gt;
  20.     &lt;script&gt;
  22.         function displayOutput() {
  23.             let inputValue = document.getElementById(&quot;input&quot;).value;
  24.             let randomNumber = Math.floor(Math.random() * 1, 101);
  26.             if (inputValue == null || inputValue == &quot;&quot;) {
  27.                 document.getElementById(&quot;output&quot;).innerHTML = 
  28.                     &quot;You have to enter a value between 1 and 100&quot;;
  29.             } else if (inputValue != randomNumber) {
  30.                 document.getElementById(&quot;output&quot;).innerHTML = 
  31.                     &quot;Your guess was incorrect. Try again.&quot;;
  32.             } else (inputValue == randomNumber) {
  33.                 document.getElementById(&quot;output&quot;).innerHTML = 
  34.                     &quot;You guessed correctly! Your number was &quot; + inputValue &quot;Good job.&quot;;
  35.             }
  37.         }
  38.     &lt;/script&gt;
  39. &lt;/body&gt;
  40. &lt;/html&gt;

I put a number in and was obviously, expecting it to display and it didn't. I thought maybe I got some names wrong or messed up in the conditionals. Can someone tell me what I did wrong?

答案1

得分: 1

你的代码中存在一些小问题。

  1. 首先，你添加了 &lt;/style&gt;，这没有任何意义。我只是将其删除了。

  2. else 语句不能带有条件，如果你想添加更多条件，应该使用 else if (条件)，但 else 是最后一个，不带条件的。

这是经过小改动的你的代码。

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7.     <title>Random Number Game</title>
  8. </head>
  9. <body>
  10.     <div>
  11.         <h1>猜一个随机数！</h1>
  12.         <input type="text" id="input" placeholder="在这里输入猜测！"><br>
  13.         <button onclick="displayOutput()">提交</button>
  14.         <p>在上面的空格中输入1 - 100之间的数字，看看你是否猜对了。</p>
  15.         <span id="output"></span>
  16.     </div>
  18.     <script>
  19.         function displayOutput() {
  20.             let inputValue = document.getElementById("input").value;
  21.             let randomNumber = Math.floor(Math.random() * 100) + 1;
  23.             if (inputValue == null || inputValue == "") {
  24.                 document.getElementById("output").innerHTML =
  25.                     "你必须输入一个1到100之间的值";
  26.             } else if (inputValue != randomNumber) {
  27.                 document.getElementById("output").innerHTML =
  28.                     "你的猜测不正确，请再试一次。";
  29.             } else {
  30.                 document.getElementById("output").innerHTML =
  31.                     "你猜对了！你的数字是 " + inputValue + "，做得好。";
  32.             }
  33.         }
  34.     </script>
  35. </body>
  36. </html>
英文:

There were small issues in your code.

  1. First of all you added &lt;/style&gt; that isn't making any sense. I simply removed that.

  2. else statement cannot have a condition if you want to add more conditions you should use else if (condition) but else is the last one with no condition.

Here, is your code with little changes.

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-html -->

  1. &lt;!DOCTYPE html&gt;
  2. &lt;html lang=&quot;en&quot;&gt;
  3. &lt;head&gt;
  4.     &lt;meta charset=&quot;UTF-8&quot;&gt;
  5.     &lt;meta http-equiv=&quot;X-UA-Compatible&quot; content=&quot;IE=edge&quot;&gt;
  6.     &lt;meta name=&quot;viewport&quot; content=&quot;width=device-width, initial-scale=1.0&quot;&gt;
  7.     &lt;title&gt;Random Number Game&lt;/title&gt;
  8. &lt;/head&gt;
  9. &lt;body&gt;
  10.     &lt;div&gt;
  11.         &lt;h1&gt;Guess a random number!&lt;/h1&gt;
  12.         &lt;input type=&quot;text&quot; id=&quot;input&quot; placeholder=&quot;Type guess here!&quot;&gt;&lt;br&gt;
  13.         &lt;button onclick=&quot;displayOutput()&quot;&gt;Submit&lt;/button&gt;
  14.         &lt;p&gt;Type in a number 1 - 100 in the space above and see if you were right or not.&lt;/p&gt;
  15.         &lt;span id=&quot;output&quot;&gt;&lt;/span&gt;
  16.     &lt;/div&gt;
  18.     &lt;script&gt;
  20.         function displayOutput() {
  21.             let inputValue = document.getElementById(&quot;input&quot;).value;
  22.             let randomNumber = Math.floor(Math.random() *1,101);
  24.             if (inputValue == null || inputValue == &quot;&quot;) {
  25.                 document.getElementById(&quot;output&quot;).innerHTML = 
  26.                     &quot;You have to enter a value between 1 and 100&quot;;
  27.             } else if (inputValue != randomNumber) {
  28.                 document.getElementById(&quot;output&quot;).innerHTML = 
  29.                     &quot;Your guess was incorrect. Try again.&quot;;
  30.             } else{
  31.                 document.getElementById(&quot;output&quot;).innerHTML = 
  32.                     &quot;You guessed correctly! Your number was &quot; + inputValue+ &quot;Good job.&quot;;
  33.             }
  35.         }
  36.     &lt;/script&gt;
  37. &lt;/body&gt;
  38. &lt;/html&gt;

<!-- end snippet -->

huangapple
  • 本文由 发表于 2023年6月8日 20:21:52
  • 转载请务必保留本文链接：https://go.coder-hub.com/76431817.html
  • conditional-statements
  • html
  • javascript
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定