如何创建使用 HTML 输入和按钮元素的 JavaScript 随机数生成器？

Question

我的目标是创建一个随机数生成器，它通过 HTML 接受用户输入，并允许用户单击 "submit" 以便 return 2 之间的随机数值。

我卡住了...我从这里去哪里？

HTML: -------------------------------------- --------------------------------

<html>

<input type="text" class="min"><br>
<input type="text" class="max"><br>
<button class="button">Submit</button>

</html>

Javascript:------------------------------------ ------------------------------

function myRand(min, max) {

var min = document.getElementByClassName(min).value;

var max = document.getElementByClassName(max).value;

var button = document.getElementByClassName(button);

var result = Math.floor(Math.random()) * (max - min) + min;

return result;
}

Answer 1

var min = document.getElementByClassName(min)[0].value; var max = document.getElementByClassName(max)[0].value;

Answer 2

有些地方不太对：

getElementByClassName 不是一个函数——它应该是 getElementsByClassName（注意 Elements 是复数）。这表明返回了一组元素，而不仅仅是一个元素。因此，您需要执行类似 getElementsByClassName(...)[0].value 的操作。或者，您可以使用 ids + getElementById.
您正在将参数 min 和 max 传递给 getElementByClassName。我认为你的意思是将一个字符串传递给这个函数，例如getElementsByClassName("min")。这样，您就不需要 myRand 函数
输入字段的值将是一个字符串，而不是数字。您需要使用 parseInt
你实际上从来没有打电话给 myRand。如果你想在按下按钮后调用它，你可以在按钮上添加一个 onclick 监听器。
随机数生成本身不正确。您首先在 Math.random() 上调用 Math.floor，但由于 Math.random() returns 是 0 和 1 之间的数字（不包括 1），结果将始终为 0（因此，变量 result 将始终设置为 min）。相反，它应该看起来像：Math.floor(Math.random() * (max - min + 1)) + min

下面的 fiddle 考虑了这些变化，并说明了如何使用 getElementById 将结果呈现到屏幕上：

https://jsfiddle.net/xv2ne0b9/13/

如何创建使用 HTML 输入和按钮元素的 JavaScript 随机数生成器？

How do I create A JavaScript Random Number Generator That Uses HTML Input, and Button Elements?

javascript

random

dom

function

getelementsbyclassname