從html表單到javascript

Question

我有一個表格，需要三個輸入如下：

  <form>
    <input name="mn" 
           type="number"
           min="1"
           value="1">
    <input name="mx" 
           type="number"
           min="2"
           value="10">
    <input name="step" 
           type="number"
           min="1"
           value="1">
    <input onclick="myfunc()"
           type="submit"
           value="calculate">
  </form>

我需要的是能夠直接在javascript中訪問這三個字段。 我不需要在其他任何地方傳遞信息。

有人能指出我正確的方向嗎？ 我已經閱讀了有一個輸入但沒有多個輸入的示例。

  <script type="text/javascript">
    function myfunc() {
    var mn = document.getElementsByName("mn")
    var mx = document.getElementsByName("mx")
    var step = document.getElementsByName("step")
    alert((mn + mx) / step)
    }
  </script>

Answer 1

給你的表單一個像這樣的id

<form id="myForm">

需要注意的另一件事是， value屬性是一個字符串，因此添加兩個值會連接它們而不是將它們相加。

試試吧

var frm = document.forms["myForm"];

var _mn = parseInt( frm["mn"].value );
var _mx = parseInt( frm["mx"].value );
var _step = parseInt( frm["step"].value );

var result = ( _mn + _mx ) / _step;

Answer 2

我開始給每個輸入一個id然后我可以使用：

var min = document.getElementById('mn')

等等。 要訪問您只需調用的值

min.value

從min和a中刪除i也沒有意義。 這並沒有優化，只是難以閱讀和理解。

Answer 3

如果您需要訪問輸入值，請將代碼更改為：

function myfunc() {
  var mn = document.getElementsByName("mn")[0];
  var mx = document.getElementsByName("mx")[0];
  var step = document.getElementsByName("step")[0];
  // you may need to validate your values here, like step.value != 0
  alert((mn.value + mx.value) / step.value)
}

Answer 4

嘗試這個：

  <script type="text/javascript">
    function myfunc() {
    var mn = document.getElementsByName("mn")[0].value;
    var mx = document.getElementsByName("mx")[0].value;
    var step = document.getElementsByName("step")[0].value;
    var top = mn / mx;
    alert(top / step);
    }
  </script>