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

My random number generator keeps changing when my function runs in javascript

本文关键字:我的 随机数生成器 变化 函数 javascript 运行时      更新时间:2023-09-26

所以基本上我想做的是让用户尝试猜测随机数,而目前发生的事情是,当我点击guess按钮时,我的随机数不断变化。我已经将随机数包含在我的较高较低旁边,这样我就可以证明它一直在变化:

这是我的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语句来告诉用户是猜测Higher还是Lower。但目前我的随机数一直在变化!有一个获取新号码按钮,该按钮用于为用户提供一个新号码。但现在我专注于获得正确的随机数

您要做的是首先创建一个随机数,并在页面加载时将其保存在某个变量中。在guessing()函数中,不要创建随机数,只需使用之前生成的数字,并根据用户输入的数字进行检查和处理。

并在用户单击"获取新号码"按钮时更改存储的号码。

我修复了它。谢谢你@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 + "  ";
}

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

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;
    ....

为了让"获取新号码"按钮正常工作,我添加了refreshNumber函数,该函数需要在单击<input type="submit" value="Get New Number" onClick="refreshNumber()"/>时调用。您应该重用该函数来设置页面加载时的数字(请参阅更新后的代码)。

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