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

Question

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

我是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>

Run Code Online (Sandbox Code Playgroud)

Answer 1

Ank*_*kit 14

一种方法是使用 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>

Run Code Online (Sandbox Code Playgroud)

Answer 2

dco*_*ith 6

首先,元素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>

Run Code Online (Sandbox Code Playgroud)

Answer 3

Sha*_*dow 5

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>

Run Code Online (Sandbox Code Playgroud)

归档时间：	11 年，9 月前
查看次数：	120889 次
最近记录：	5 年，12 月前