使用HTML5输出来四舍五入小数点

Question

我正在制作一个类似于的HTML5计算器。

<form onsubmit="return false" oninput="o.value = a.valueAsNumber + b.valueAsNumber"<br>
    <input name="a" id="a" type="number" step="any"> +<br>
    <input name="b" id="b" type="number" step="any"> =<br>
    <output name="o" for="a b"></output><br>
</form>

我希望您能将结果四舍五入到小数点后两位。

- RLeisinger

---

哦，<output>标签。有趣... - Joseph

Answer 1

toFixed 是另一种实现你所需求的功能的方法，不管小数末尾是否为0，都会始终显示指定的小数位数。

<form onsubmit="return false" oninput="o.value = (a.valueAsNumber + b.valueAsNumber).toFixed(2)"<br>
    <input name="a" id="a" type="number" step="any"> +<br>
    <input name="b" id="b" type="number" step="any"> =<br>
    <output name="o" for="a b"></output><br>
</form>​

演示

- Loktar

---

在这种情况下，您的答案可能更好，而且肯定更简单。+1 - sachleen

@sachleen 谢谢，但我有点矛盾，因为你的答案是使用JS将数字四舍五入到最近的小数位的事实标准方式 :? 所以我也给你加一分 :P - Loktar

两种方法都可以，但正如Loktar在下面提到的那样，toFixed将小数保留在两个位置上，并且更适合显示货币。 - RLeisinger

Answer 2

这将四舍五入到小数点后两位。

Math.round(num * 100)/100

这是其更为通用的版本，可以将结果舍入到指定的小数位数。

function roundNumber(num, places) {
    return Math.round(num * Math.pow(10, places)) / Math.pow(10, places);
}

roundNumber(24.2424, 2)
24.24

- sachleen

---

这通常是我的首选方法。唯一需要考虑的是，如果小数位为零，则此方法不会显示任何小数位。因此，如果他只是出于显示目的而这样做，5+5将显示10，而不是10.00。 - Loktar