使用JavaScript从输入中读取数字始终返回NaN

Question

我想创建一个简单地将2个字段相加的计算器.但无论我尝试什么它都行不通.如果我使用parseInt(),它也会返回"NaN".

这是代码:

 <script type="text/javascript" language="Javascript">
 function doSum() 
 {
 var a = document.getElementsByName("a").value;
 var b = document.getElementsByName("b").value;

 var sum =  a + b;

 document.getElementById("sum").value = sum;
}
</script>

<form action="" method="POST">
<br/>a:<br/>
<input type="text" name="a" onblur='doSum()' value="0" size="5" />
<br/>b:<br/>
<input type="text" name="b" onblur='doSum()' value="0" size="5" />
<br/>Ergebnis<br/>
<input type="text" id='sum' value='' size="50" disabled/>
</form>

对不起那个noob问题,但是我做错了什么？谢谢你的帮助!

Answer 1

给ids到您的投入和使用识别它们唯一document.getElementById.然后,使用radix参数设置为10 获取其十进制int值parseInt,并按当前显示结果.

<script type="text/javascript" language="Javascript">
 function doSum() 
 {
  var a = parseInt(document.getElementById("a").value, 10);
  var b = parseInt(document.getElementById("b").value, 10);

  var sum =  a + b;

  document.getElementById("sum").value = sum;
}
</script>

<form action="" method="POST">
 <br/>a:<br/>
<input type="text" id="a" onblur='doSum()' value="0" size="5" />
 <br/>b:<br/>
<input type="text" id="b" onblur='doSum()' value="0" size="5" />
 <br/>Ergebnis<br/>
<input type="text" id='sum' value='' size="50" disabled/>
</form>

getElementsByName 返回一个元素列表,你必须通过索引引用你想要的元素,即使列表只包含一个元素.

getElementById 另一方面,通过其id返回唯一标识的元素.