时间戳

首页 > 解决方案 > 不生成随机数

javascript - 不生成随机数

问题描述

我正在制作一个使用 JS 生成随机数的网站。但它undefined出于某种原因显示。我不希望那样发生。这是我的代码。

var showRandomNumberDiv = document.getElementById("show-random-number");
var number1 = document.getElementById("number-1");
var number2 = document.getElementById("number-2");
var generate = document.getElementById("generate");

var newPara = document.createElement("p");
generate.addEventListener("click", function() {
  numbers = [];
  for (var i = 0; i > number1 && i < number2; i++) {
    numbers.push(i);
  }
  newPara.innerHTML = numbers[Math.floor(Math.random() * numbers.length)];
  showRandomNumberDiv.appendChild(newPara);
})
<h1>Hello, and welcome to Random generator!</h1>
<h2>Not only numbers, but letters too!</h2>
<p>If you want to enter a <span style="font-style:italic; font-weight: bold;">positive</span> number, see below.</p>

<!-- Generate a random number -->

<input type="text" placeholder="number 1" id="number-1">
<input type="text" placeholder="number 2" id="number-2">
<input type="button" value="Generate" id="generate">
<div id="show-random-number">

</div>

<script src="javascript.js"></script>

标签： javascripthtmlrandom

解决方案

您确实在代码中犯了一些错误。这是固定版本：

var showRandomNumberDiv = document.getElementById("show-random-number");
var number1 = document.getElementById("number-1");
var number2 = document.getElementById("number-2");
var generate = document.getElementById("generate");

var newPara = document.createElement("p");
showRandomNumberDiv.appendChild(newPara);

generate.addEventListener("click", function() {
  var numbers = [];
  for (var i = parseInt(number1.value); i < parseInt(number2.value); i++) {
    numbers.push(i);
  }
  newPara.innerHTML = numbers[Math.floor(Math.random() * numbers.length)];
})
<h1>Hello, and welcome to Random generator!</h1>
<h2>Not only numbers, but letters too!</h2>
<p>If you want to enter a <span style="font-style:italic; font-weight: bold;">positive</span> number, see below.</p>

<!-- Generate a random number -->

<input type="text" placeholder="number 1" id="number-1">
<input type="text" placeholder="number 2" id="number-2">
<input type="button" value="Generate" id="generate">
<div id="show-random-number">

</div>

<script src="javascript.js"></script>

要从输入中获取价值，您必须使用input.value属性。您还可以使用parseInt函数将字符串值转换为数字。

这里也是代码的优化版本。

var showRandomNumberDiv = document.getElementById("show-random-number");
var number1 = document.getElementById("number-1");
var number2 = document.getElementById("number-2");
var generate = document.getElementById("generate");

var newPara = document.createElement("p");
showRandomNumberDiv.appendChild(newPara);

generate.addEventListener("click", function() {
  var min = parseInt(number1.value);
  var max = parseInt(number2.value);
  
  newPara.innerText = min + Math.round(Math.random() * (max - min));
})
<h1>Hello, and welcome to Random generator!</h1>
<h2>Not only numbers, but letters too!</h2>
<p>If you want to enter a <span style="font-style:italic; font-weight: bold;">positive</span> number, see below.</p>

<!-- Generate a random number -->

<input type="text" placeholder="number 1" id="number-1">
<input type="text" placeholder="number 2" id="number-2">
<input type="button" value="Generate" id="generate">
<div id="show-random-number">

</div>

<script src="javascript.js"></script>

您可以乘以Math.random()最大值和最小值之间的差并将结果添加到最小值以获得最小值和最大值之间的随机数。

推荐阅读