JavaScript 计算结果不正确

Question

我是 JavaScript 的新手，想将我的一个计算电子表格转换成我可以在网页上使用的东西。但是，计算结果不正确。

这是我的 JavaScript:

<script type="text/javascript" language="JavaScript">
        function calc() {
            var onerepmax = document.wodCalculate.oneRepMax.value;
            var percent = document.wodCalculate.percentOfOneRepMax.value / 100;
            var addkg = document.wodCalculate.plusKg.value;
            var zwischenschritt = onerepmax * percent;
            var gewicht = zwischenschritt + addkg;
            document.getElementById("weight").innerHTML = gewicht;
        };
</script>

这里是 HTML:

<form action="" id="wodCalculate" name="wodCalculate">
        <table cellspacing="0" cellpadding="10" border="0">
            <tr><td>1 Rep Max</td><td><input type=text name="oneRepMax" value="">&nbsp;kg<br></td></tr>
            <tr><td>% vom 1RM</td><td><input type=text name="percentOfOneRepMax" value="">&nbsp;%<br></td></tr>
            <tr><td>Plus x kg</td><td><input type=text name="plusKg" value="">&nbsp;kg<br></td></tr>
            <tr><td><input type="button" value="Calculate" onClick="calc()"></td></tr>
        </table>
</form>
<div id="weight">Weight</div>

在 "onerepmax" 与 "percent" 相乘之前，它工作正常。但是，一旦达到将 "addkg" 添加到乘法结果的程度（即给我 "gewicht"），结果就会变得不正确。

比如我想取100kg的10%加10kg。而不是20kg，计算结果是1010

感谢您的帮助！

Answer 1

input 的 value 始终是一个字符串，因此 + 最终成为字符串连接（"10" + "10" 是 "1010"，而不是10 + 10 即 20).

如果你使用的是input type="number"（OP不是，但其他人可能会找到这个答案）并且浏览器支持它们，你可以使用valueAsNumber 改为：

var onerepmax = document.wodCalculate.oneRepMax.valueAsNumber;

如果您使用 type="text" 或浏览器不支持 valueAsNumber:

如果用户输入的值是整数，您可以使用 parseInt(value, 10)（10 = 十进制，以 10 为底）转换用户输入值，例如：

var onerepmax = parseInt(document.wodCalculate.oneRepMax.value, 10);

这只是一种选择，不过，您有多种选择：

一元 + 运算符：value = +value 将使用 JavaScript 引擎的标准规则将字符串强制转换为数字。该数字可以包含小数部分（例如，+"1.50" 是 1.5）。字符串中的任何非数字（科学记数法的 e 除外）都会产生结果 NaN。此外，+"" 是 0，这可能不直观。
```
var onerepmax = +document.wodCalculate.oneRepMax.value;
```

Number 函数：value = Number(value)。与 +.

做同样的事情

var onerepmax = Number(document.wodCalculate.oneRepMax.value);

parseInt函数，通常带有一个基数（基数）：value = parseInt(value, 10)。这里的缺点是 parseInt 转换它在字符串开头找到的任何数字，但忽略字符串后面的非数字，因此 parseInt("100asdf", 10) 是 100，而不是 NaN。顾名思义，parseInt 只解析一个整数。
```
// (Same as the first one above)
var onerepmax = parseInt(document.wodCalculate.oneRepMax.value, 10);
```
parseFloat 函数：value = parseFloat(value)。允许分数值，并且始终以十进制形式工作（绝不是八进制或十六进制）。 parseInt 对字符串末尾的垃圾做同样的事情，parseFloat("123.34alksdjf") 是 123.34.
```
var onerepmax = parseFloat(document.wodCalculate.oneRepMax.value);
```

因此，选择适合您的用例的工具。 :-)

Answer 2

问题是您 "adding" 是一个字符串，而不是一个数字。 JavaScript中的+运算符有多重语义，只要一个操作数是字符串，它就会进行字符串连接。

为防止出现这种情况，请使用一元 + 运算符将字符串转换为数字。

JavaScript 计算结果不正确

Incorrect result in JavaScript calculation

javascript

calc