添加来自js中输入的值

Question

当我尝试添加多个值时，它们只是被追加。

这些是我的输入（它们看起来都一样）：

<input type="number" id="floatOne" required>

这是我的脚本：

<script>
function calcExactFloat(){
    var floats = new Array(document.getElementById("floatOne").value, document.getElementById("floatTwo").value,document.getElementById("floatThree").value,document.getElementById("floatFour").value,document.getElementById("floatFive").value,document.getElementById("floatSix").value,document.getElementById("floatSeven").value,document.getElementById("floatEight").value,document.getElementById("floatNine").value,document.getElementById("floatTen").value);

    var sum = 0;

    for(var i = 0; i < floats.length; ++i){
        sum = sum + floats[i];
        console.log(sum);
    }

Answer 1

.value 从输入返回的值被认为是 string 所以你应该将它们转换为 float 然后你可以进行计算，所以替换以下行：

sum = sum + floats[i];

作者：

sum = sum + parseFloat(floats[i]);

希望对您有所帮助。

var floats = new Array(document.getElementById("floatOne").value, document.getElementById("floatTwo").value,document.getElementById("floatThree").value,document.getElementById("floatFour").value);

var sum = 0;

for(var i = 0; i < floats.length; ++i){
  sum = sum + parseFloat(floats[i]);
}

result.textContent = sum;

<input type="number" id="floatOne" value='10'>
<input type="number" id="floatTwo" value='10'>
<input type="number" id="floatThree" value='10'>
<input type="number" id="floatFour" value='10'>
<br/>
Result : <span id="result"></span>

Answer 2

输入元素的值如果是字符串，即使该字符串表示数值。在 JavaScript 中，"addition" 个字符串导致串联 - ('1' + '1') === '11'.

要将字符串转换成数字，最简单的方法是在变量-前加一个+ +a + +b.

这样试试：

var sum = 0;

for(var i = 0; i < floats.length; ++i){
    sum = sum + +floats[i];
    console.log(sum);
}

Answer 3

你必须使用 parseFloat

function calcExactFloat(){
    var floats = new Array(document.getElementById("floatOne").value, document.getElementById("floatTwo").value,document.getElementById("floatThree").value,document.getElementById("floatFour").value,document.getElementById("floatFive").value,document.getElementById("floatSix").value,document.getElementById("floatSeven").value,document.getElementById("floatEight").value,document.getElementById("floatNine").value,document.getElementById("floatTen").value);

    var sum = 0;

    for(var i = 0; i < floats.length; i++){
 if(floats[i])
        sum = sum + parseFloat(floats[i]);
    }
 alert(sum)
 }

 <input type="number" id="floatOne" required><br />
 <input type="number" id="floatTwo" required><br />
 <input type="number" id="floatThree" required><br />
 <input type="number" id="floatFour" required><br />
 <input type="number" id="floatFive" required><br />
 <input type="number" id="floatSix" required><br />
     <input type="number" id="floatSeven" required><br />
 <input type="number" id="floatEight" required><br />
 <input type="number" id="floatNine" required><br />
 <input type="number" id="floatTen" required><br />
  <input type="button" value="Calc" onclick="calcExactFloat()" />

添加来自js中输入的值

Adding values coming from input in js

javascript

append

addition