首页 > 解决方案 > 如何获取javascript的输入值

问题描述

我目前正在尝试获取用户选择作为其号码的输入字段的值,但由于某种原因我无法做到。

我已经尝试将其设置为 id,然后进行操作document.getElementById("testing").value,但没有成功。

这是我当前的代码:

<section class="generate">
  <div class="container">
    <h3>Generate a number between </h3>
    <form>
      First number
      <input id="testing" type="number" name="firstnumber" value="First number">
      <br> Second number
      <input type="number" name="secondnumber" value="Second number">
      <br>
      <input type="submit" value="Generate random number">
      <script>
        var secondNumber = document.getElementById('testing').value
        var randomNumber = Math.floor(Math.random() * secondNumber);
        console.log(randomNumber);
        console.log(secondNumber);
      </script>
    </form>
  </div>
</section>

标签: javascripthtml

解决方案


您需要在事件侦听器中运行代码,而不是在页面首次加载时运行。

document.querySelector("form").addEventListener("submit", function(e) {
  e.preventDefault(); // prevent form from really submitting
  var secondNumber = document.getElementById('testing').value
  var randomNumber = Math.floor(Math.random() * secondNumber);
  console.log(randomNumber);
  console.log(secondNumber);
});
<section class="generate">
  <div class="container">
    <h3>Generate a number between </h3>
    <form>
      First number
      <input id="testing" type="number" name="firstnumber" value="First number">
      <br> Second number
      <input type="number" name="secondnumber" value="Second number">
      <br>
      <input type="submit" value="Generate random number">
    </form>
  </div>
</section>


推荐阅读