Question

所以基本上我想要做的就是让用户尝试猜测随机数，而目前发生的事情是，当我点击猜测按钮时，我的随机数会不断变化。我已将随机数包含在我的更高或更低旁边，以便我可以证明它不断变化：

这是我的HTML：

<div data-role="page" id="page2">
  <div data-role="header">
    <h1>Guess a Number</h1>
  </div>
  <div data-role="content">
    <div data-role="fieldcontain">
      <label for="guess">Text Input:</label>
      <input type="text" name="guess" id="guess" value=""  />
    </div>  
    <p id="highlow"></p>
    <input type="submit" value="Guess" onClick="guessing()" />
    <p id="correct"></p>
    <p id="timesGuessed".</p>
    <p id="showGuessed"></p>
    <input id="show"type="submit" value="Show The Number" onClick=""/>
    <p id="showNumber"></p>
    <input type="submit" value="Get New Number" onClick=""/>
  </div>
  <div data-role="footer">
    <h4>Page Footer</h4>
  </div>
</div>

这是我的Javascript：

function guessing() {

  var random = Math.floor((Math.random() * 100) + 1);
  var round = Math.round(random) ;
  var number = round;
  var guess = document.getElementById('guess').value;
  var guessed = '';

  if(guess < number) {
    document.getElementById('highlow').innerHTML = "Higher" + number;
  } 
  else if (guess > number) {
    document.getElementById('highlow').innerHTML = "Lower";
  }
  else {
    document.getElementById('correct').innerHTML = "Correct, The number was: " + number;
  } 

  document.getElementById('show').onclick = function() {
    document.getElementById('showNumber').innerHTML = "The number was: " + number;  
  };

  guessed += guess ;
  document.getElementById('showGuessed').innerHTML += "  " + guess + "  ";
}

只是我想要做的事情的摘要，对于我需要允许用户输入数字以尝试猜测随机数的项目，我使用了if语句告诉用户是否猜测更高或更低，但此刻我的随机数不断变化！有一个获取新号码按钮，可以为用户提供一个新号码。但是现在我专注于让随机数正确

Answer 1

你需要做的是首先创建一个随机数，并在页面加载时将其保存在某个变量中，并且在你的guessing（）函数中没有创建一个随机数，只需使用之前生成的数字并检查输入的用户您可能需要的数量和流程。

当用户点击“获取新号码”按钮时，更改存储的号码。

Answer 2

每次调用var random = Math.floor((Math.random() * 100) + 1);时，您都会创建guessing()。您需要在页面加载时分配数字。将其分配到函数外部将使其在函数内可访问。

var number; // declare in global scope
refreshNumber();

// refresh number
function refreshNumber()
{
    var random = Math.floor((Math.random() * 100) + 1);
    number = Math.round(random) ;
}

// called every time a guess is made
function guessing()
{
    // remove these three lines
    // var random = Math.floor((Math.random() * 100) + 1);
    // var round = Math.round(random) ;
    // var number = round;
    // leave the rest
    var guess = document.getElementById('guess').value;
    ....

要使“获取新号码”按钮生效，我添加了需要调用点击<input type="submit" value="Get New Number" onClick="refreshNumber()"/>的函数refreshNumber。您应该重复使用该函数来设置页面加载的数量（请参阅更新的代码）。

演示：http://jsfiddle.net/ow7Lvz3s/

Answer 3

我修好了。谢谢你@Yamu。我刚刚在函数外添加了随机数：）。

random = Math.floor((Math.random() * 100) + 1);
round = Math.round(random) ;
number = round;
function guessing()
{


var guess = document.getElementById('guess').value;
var guessed = '';

    if(guess < number)
    {
        document.getElementById('highlow').innerHTML = "Higher" + number;
    }
    else if (guess > number)
    {
        document.getElementById('highlow').innerHTML = "Lower";
    }
    else
    {
        document.getElementById('correct').innerHTML = "Correct, The number was: " + number;
    }   

        document.getElementById('show').onclick = function()
        {
            document.getElementById('showNumber').innerHTML = "The number was: " + number;  
        };


    guessed += guess ;
    document.getElementById('showGuessed').innerHTML += "  " + guess + "  ";

}

当我的函数在javascript中运行时，我的随机数生成器不断变化

3 个答案: