1个ID是唯一的

Question

我是JavaScript的新手，我正在试图弄清楚如何将用户输入的值作为参数传递给JavaScript函数。这是我的代码：

<body>
<h1>Adding 'a' and 'b'</h1>
<form>
  a: <input type="number" name="a" id="a"><br>
  b: <input type="number" name="b" id="a"><br>
  <button onclick="add(a,b)">Add</button>
</form>
<script>
  function add(a,b) {
    var sum = a + b;
    alert(sum);
  }
</script>
</body>

Answer 1

一种方法是使用document.getElementByID

<body>
<h1>Adding 'a' and 'b'</h1>

  a: <input type="number" name="a" id="a"><br>
  b: <input type="number" name="b" id="b"><br>
  <button onclick="add(document.getElementById('a').value,document.getElementById('b').value)">Add</button>

<script>
  function add(a,b) {
    var sum = parseInt(a) + parseInt(b);
    alert(sum);
  }
</script>
</body>

Answer 2

首先，元素ID应始终是唯一的。如果您的元素ID不是唯一的，那么您将始终获得相互矛盾的结果。想象一下，在你的情况下使用两个具有相同ID的不同元素。

<form>
  a: <input type="number" name="a" id="a"><br>
  b: <input type="number" name="b" id="b"><br>
  <button onclick="add()">Add</button>
</form>

<script>
  function add() {
    var a = document.getElementById('a').value;
    var b = document.getElementById('b').value;

    var sum = parseInt(a) + parseInt(b);
    alert(sum);
  }
</script>

Answer 3

1个ID是唯一的

2您不需要传递任何参数，因为您可以在javascript中调用它们

<form>
  a: <input type="number" name="a" id="a"><br>
  b: <input type="number" name="b" id="b"><br>
  <button onclick="add()">Add</button>
</form>
<script>
  function add() {
    var a = document.getElementById('a').value;
    var b = document.getElementById('b').value;
    var sum = a + b;
    alert(sum);
  }
</script>

Answer 4

您可以使用ID获取值。但ID应该是唯一的。

<body>
<h1>Adding 'a' and 'b'</h1>
<form>
  a: <input type="number" name="a" id="a"><br>
  b: <input type="number" name="b" id="b"><br>
  <button onclick="add()">Add</button>
</form>
<script>
  function add() {
    a = $('#a').val();
    b = $('#b').val();
    var sum = a + b;
    alert(sum);
  }
</script>
</body>

Answer 5

你使用jquery吗？如果那么：

$('#xx').val();

或使用原始javascript（DOM）

document.getElementById('xx').value

或

xxxform.xx.value;

如果你想了解更多，w3chool可以帮到你很多。

Answer 6

使用它可以工作，

<body>
<h1>Adding 'a' and 'b'</h1>
<form>
  a: <input type="number" name="a" id="a"><br>
  b: <input type="number" name="b" id="a"><br>
  <button onclick="add()">Add</button>
</form>
<script>
  function add() {
    var m = document.getElementById("a").value;
    var n = document.getElementById("b").value;
    var sum = m + n;
    alert(sum);
  }
</script>
</body>

Answer 7

   <form action="" onsubmit="additon()" name="form1" id="form1">
      a: <input type="number" name="a" id="a"><br>
      b: <input type="number" name="b" id="b"><br>
      <input type="submit" value="Submit" name="submit">
   </form>
  <script>
      function additon() 
      {
           var a = document.getElementById('a').value;
           var b = document.getElementById('b').value;
           var sum = a + b;
           return sum;
      }
  </script>

将HTML输入值作为JavaScript函数参数传递

7 个答案:

1个ID是唯一的

2您不需要传递任何参数，因为您可以在javascript中调用它们