如何从输入标签中总结两个数字? [英] how to sum two numbers from input tag?

问题描述

可能的重复:
如何将两个字符串作为数字相加?

我写了一个简单的 JavaScript 代码，我想使用两个输入框并从两个值中添加数字.这是代码，我看到结果是 1520 而不是 35.

I wrote a simple JavaScript code and I want to use two input box and add numbers from the two value. Here's the code, and I see the result 1520 instead of 35.

我该如何解决?

n1 <input type = "number" id = "n1" value=15 />
n2 <input type = "number" id = "n2" value=20 />

<p>Sum?</p>
<button onclick="sum()">Try it</button>
<p id="demo2">Result?? </p>

<script type="text/javascript">
 function sum() 
{ 
    var fn, ln; 
    fn = document.getElementById("n1").value; 
    ln = document.getElementById("n2").value; 
    result =  (fn+ln); 
    document.getElementById("demo2").innerHTML = result; 
}
</script>

推荐答案

Use parseInt(), or parseFloat();您遇到的问题是您正在连接两个字符串，而不是将两个数字相加.parseInt()(假设它找到一个实数)通过将字符串转换为数字来解决这个问题:

Use parseInt(), or parseFloat(); the problem you were experiencing is that you were concatenating two strings, not adding two numbers. parseInt() (assuming that it finds a real number) addresses that issue by converting the string to a number:

 function sum() 
{ 
    var fn, ln, result; 
    fn = parseInt(document.getElementById("n1").value, 10);
    ln = parseInt(document.getElementById("n2").value, 10);
    result =  (fn+ln); 
    document.getElementById("demo2").innerHTML = result; 
}

出现在 value 之后的 , 10 是基数，它确保返回的数字(如果有)将基于哪个数字.

The , 10 that appears after the value is the radix, which ensures which number-base the returned number (if any) will be.

另请注意，result 变量也应在函数中声明，以避免污染全局范围(并可能在其他地方与其他变量产生问题).

Also note that the result variable should be declared within the function as well, to avoid polluting the global scope (and possibly creating problems with other variables elsewhere).

参考文献:

• parseFloat().
• parseInt().

这篇关于如何从输入标签中总结两个数字?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！