HTML JavaScript 随机数选择

Question

我一直在尝试为两个输入之间的数字获取一个随机数生成器。我有代码

<form action="/action_page.php">
<input type="number" name="low" id="low" placeholder="lowest number" value="1"><br>
<input type="number" name="high" id="high" placeholder="highest number" value="10"><br>
<input type="button" value="Submit" onclick="myFunction()">
</form>
<p id="randnum"></p>

<script>
function myFunction() {
    var x = document.getElementById("randnum")
    x.innerHTML = Math.floor((Math.random() * 'low') + 'high');
}
</script>

如您所见，我在一个代码中包含了 javascript。

我输入“低”和“高”的地方是固定数字

Answer 1

您需要获取输入的值并将其应用于计算。 - 请注意，我正在使用 parseInt() 将输入值转换为数字。此外 - 使用 1 作为低值将始终产生 10 的结果，因为你得到了 math.floor - 这将等于 0 - 所以 0 + 10 = 10。

根据@Quentins 的评论 - 我提醒计算适合您的数字。

function myFunction() {
    var x = document.getElementById("randnum");
    var high = parseInt(document.getElementById("high").value);
    var low = parseInt(document.getElementById("low").value);
    x.innerHTML = Math.floor(Math.random()*(high-low+1)+low)
}

<form action="/action_page.php">
<input type="number" name="low" id="low" placeholder="lowest number" value="1"><br>
<input type="number" name="high" id="high" placeholder="highest number" value="10"><br>
<input type="button" value="Submit" onclick="myFunction()">
</form>
<p id="randnum"></p>

Answer 2

<form action="/action_page.php">
<input type="number" name="low" id="low" placeholder="lowest number" value="1"><br>
<input type="number" name="high" id="high" placeholder="highest number" value="10"><br>
<input type="button" value="Submit" onclick="myFunction()">
</form>
<p id="randnum"></p>

<script>
myFunction = () => {
let min = parseInt(low.value, 0);
let max = parseInt(high.value, 0);

let x = document.getElementById("randnum")
x.innerHTML = Math.floor(Math.random() * (max - min)) + min;
}
</script>

Answer 3

我认为这会有所帮助。

<form action="/action_page.php">
<input type="number" name="low" id="low" placeholder="lowest number" value="1"><br>
<input type="number" name="high" id="high" placeholder="highest number" value="10"><br>
<input type="button" value="Submit" onclick="myFunction()">
</form>
<p id="randnum"></p>

<script>
function myFunction() {
    var x = document.getElementById("randnum")
    var low = document.getElementById("low").value;
    var high = document.getElementById("high").value;
    x.innerHTML = Math.floor((Math.random() * low) + high);
}
</script>

Answer 4

var max = parseInt($("#high")[0].value);
var min = parseInt($("#low")[0].value);
x.innerHTML = Math.floor(Math.random() * max) + min;

Answer 5

首先，在(Math.random() * 'low') + 'high' 中，low 和 high 并不是真正的整数值。

其次，其他人没有提到的一个非常重要的问题是Math.random() 返回一个介于 0 和 1 之间的双精度值。如果您遵循其他一些答案，随机数将始终为 0 .

使用这个：

<form action="/action_page.php">
<input type="number" name="low" id="low" placeholder="lowest number" 
value="1"><br>
<input type="number" name="high" id="high" placeholder="highest number" 
value="10"><br>
<input type="button" value="Submit" onclick="myFunction()">
</form>
<p id="randnum"></p>

<script>
function myFunction() {
var x = document.getElementById("randnum")
var low = document.getElementById("low").value;
var high = document.getElementById("high").value;
var random = Math.random();
x.innerHTML = Math.floor(random * (high-low) + high);
}
</script>