Question

我正在写一个js。程序，只要按下“ GENERATE”按钮，就显示1到<input/>中输入的任意数字之间的随机数。

问题是当我按下“ GENERATE”按钮时，它返回“ NaN”。

这是我所拥有的：

<!DOCTYPE html>

  <meta charset="utf-8">
        <link rel='stylesheet' href='style.css'/>
        <script src='script.js'></script>

</head>
<body>

  <br/>
  <center>
  <div><button onclick="generate()" title="generate random 
  number">GENERATE</button> <p class="space" id="space"></p> </div>

  <input id="number" type="number" name="contestants" min="1" 
  placeholder="max">

  </center>


</body>

var max = document.getElementById("number");

function generate(){

document.getElementById("space").innerHTML = Math.floor(Math.random() * max) + 1;

}

<p class="space" id="space"></p>是显示在“ GENERATE”按钮下方的最终随机数。

请帮助；我只是从html，css和JavaScript这件事开始，所以如果我能弄清楚这一点，那就太好了。

var max = document.getElementById("number");

function generate(max) {

  document.getElementById("space").innerHTML = Math.floor(Math.random() * max) + 1;

}

body {
  background-color: black;
}

button {
  background-color: white;
  border-style: none;
  height: 50px;
  width: 150px;
  font-size: 24px;
  text-align: center;
}

.space {
  color: white;
  font-size: 30px;
}

<!DOCTYPE html>
<html>

<head>

  <meta charset="utf-8">
  <link rel='stylesheet' href='style.css' />
  <script src='script.js'></script>

</head>

<body>

  <br/>
  <center>
    <div><button onclick="generate()" title="generate random number">GENERATE</button>
      <p class="space" id="space"></p>
    </div>

    <input id="number" type="number" name="contestants" min="1" placeholder="max">

</body>

</html>

Answer 1

好像您在max变量try上缺少“ .value”

var max = document.getElementById("number").value;

Answer 2

您需要添加此代码var max = document.geElementBtId（“ number”）。value

在您的generate方法内部，并从generate方法中删除max参数。

Answer 3

尝试一下：-

使用值函数从元素获取实际值

更改Math.floor(Math.random() * maxNumber.value) + 1

function generate(maxNumber) {
   var maxNumber = document.getElementById("number");  

  document.getElementById("space").innerHTML = Math.floor(Math.random() * 100);

}

body {
  background-color: black;
}

button {
  background-color: white;
  border-style: none;
  height: 50px;
  width: 150px;
  font-size: 24px;
  text-align: center;
}

.space {
  color: white;
  font-size: 30px;
}

<html>

<head>

  <meta charset="utf-8">
  <link rel='stylesheet' href='style.css' />
  <script src='script.js'></script>

</head>

<body>

  <br/>
  <center>
    <div><button onclick="generate()" title="generate random number">GENERATE</button>
      <p class="space" id="space"></p>
    </div>

    <input id="number" type="number" name="contestants" min="1" placeholder="max">

</body>

</html>

Answer 4

替换

document.getElementById("space").innerHTML = Math.floor(Math.random() * max) + 1;

使用

document.getElementById("space").innerHTML =Math.floor(Math.random() * parseInt(max.value)) + 1;

Answer 5

移动

var max = document.getElementById（“ number”）。value;

进入 generate（）函数，因为在页面加载时，它试图获取输入字段的值，该值最初为空，因此引发错误

function generate() {
        var max =document.getElementById("myNumber").value;
        // console.log(max);
        document.getElementById("space").innerHTML = Math.floor(Math.random() * max) + 1;
    }

Answer 6

您必须使用诸如此类的generate函数：

    function generate(maxNumber) {
       var maxNumber = document.getElementById("number");  
       document.getElementById("space").innerHTML = Math.floor(Math.random() * 100);
    }

上面的代码是：Math.floor（Math.random（）* 100）最后一个参数给出了随机数的最大值。例如，如果您的数字在0到10之间，则必须编写 Math.floor（Math.random（）* 10）。

document.getElementById（“ id”）;不管用

6 个答案: