无法从输入类型号中获取值

Question

我正在尝试从“min_num”和“max_num”字段中获取输入值，但那里什么也没有。此外，当我尝试 parseInt() 方法时，我得到的不是数字（NaN）...

我该如何解决这个问题？

        var min_num = document.getElementById("min_num").value;
        var max_num = document.getElementById("max_num").value;
        var generate = document.getElementById("generate");

        

        function myRandomNumber(min, max) {

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

            document.getElementById("random_number").value = randomNumber;


        }

        generate.onclick = myRandomNumber(min_num, max_num);

<form action="#">
        <input type="number" id="min_num" placeholder="Minimum number">
        <input type="number" id="max_num" placeholder="Maximum number"><br>
        <input type="text" id="random_number" disabled="disabled" placeholder="Random number">
        <button id="generate">Generate</button>
    </form>

Answer 1

你有 4 个问题：

1. 您在页面加载时读取了该值。该值不会更新，它会及时读取并存储。

2. 你调用一个函数，它返回的内容被存储到事件监听器中

3. 您使用的是字符串而不是数字。您需要将值转换为数字。

4. 您不会在您认为的范围内生成随机数。它可以生成一个大于最大值的数字。

  var min_num = document.getElementById("min_num"); // do not read the value
  var max_num = document.getElementById("max_num");
  var generate = document.getElementById("generate");



  function myRandomNumber(min, max) {
    var randomNumber = Math.floor(Math.random() * (max - min + 1)) + min; // need to subtract the min
    document.getElementById("random_number").value = randomNumber;

  }

  generate.addEventListener("click", function() { // not calling the function
    myRandomNumber(+min_num.value, +max_num.value);  // reading the value and converting it to a number
  });

<form>
  <input type="number" id="min_num" placeholder="Minimum number">
  <input type="number" id="max_num" placeholder="Maximum number"><br>
  <input type="text" id="random_number" disabled="disabled" placeholder="Random number">
  <button type="button" id="generate">Generate</button>
</form>