javascript – 如何在页面加载时生成随机数？

我正在尝试在页面加载时生成一个随机数,但由于某些原因它似乎不起作用.每次用户按下提交按钮时,随机数就会继续生成,而不是仅在页面加载开始时生成一次.

我的HTML：

<!DOCTYPE html>
 <html>
  <head>
   <title> How many fingers </title>
   <script type="text/javascript" src="main.js"> </script>
 </head>

  <body>
   <h1> Test your luck </h1>
   <h2> How many fingers do I have?<h2>
   <input type="text" id="myGuess">
   <button id="button" onclick="check()"> submit </button>
</body>
</html>

我的JavaScript：

function loadNumber(){
   var myNumber = (Math.floor(Math.random()*10) +1);
 }
 //am not sure if the above function should generate the random number!
 window.onload = loadNumber;

function check(){

  var numberOfGuesses = (Math.floor(Math.random()*9)+1);
  var guess = document.getElementById("myGuess").value;
  var number = (Math.floor(Math.random()*10) +1);

  if(guess==number){
      alert("correct,it took you " + numberOfGuesses + " guesses to get it 
       right")
      document.location.reload();
   }else{
    numberOfGuesses++;
    alert("nope,try again!")
  }
}

解决方法

随机数正在变化,因为您每按一次按钮就会生成一个新的随机数.您在loadNumber()中生成的myNumber变量在函数范围之外不可用,并且未在按钮的onClick函数中使用.

在下面的代码片段中,我在函数外部传递了myNumber的声明,以便两个函数都可以访问它并构造猜测计数器(起始值为0)

var myNumber;
var numberOfGuesses = 0;

function loadNumber() {
   myNumber = Math.floor(Math.random() * 10) + 1;
}

function check() {
    numberOfGuesses++;
    var guess = document.getElementById("myGuess").value;
    if (guess == myNumber) {
        alert("correct,it took you " + numberOfGuesses + " guesses to get it right");
        document.location.reload();
    } else {
        alert("nope,try again!");
    }
}

loadNumber();

<!DOCTYPE html>
<html>
<head>
    <title>How many fingers</title>
    <script type="text/javascript" src="main.js"> </script>
</head>

<body>
    <h1>Test your luck</h1>
    <h2>How many fingers do I have?<h2>
    <input type="text" id="myGuess">
    <button id="button" onclick="check()">submit</button>
</body>
</html>

javascript – 如何在页面加载时生成随机数？

解决方法

相关推荐