繁体   English   中英

使用Javascript计算输入字段值并显示2位小数位精度

[英]Javascript to calculate input field values and show 2 decimal place accuracy

我知道这可能是一个重复的问题,但是我一直在寻找年龄并且无法弄清楚为什么它不起作用。

我有3个输入字段,小计,增值税和总计:当要在小计中输入值时,我希望能够用值来填充增值税和总计收支字段,并在其后显示2个小数位数。 所以:

4将是4.00 4.5将是4.50

输入字段的HTML代码:

<input name="subtotal" id="subtotal" type="number" maxlength="20" min="0" placeholder="00.00" onchange="vatCalculation();" />

<input name="vat" id="vat" type="number" maxlength="20" min="0" placeholder="00.00" readonly="true" />

<input name="total" id="total" type="number" maxlength="20" min="0" placeholder="00.00" readonly="true" />

我现在的javascript代码是:

function vatCalculation() {
var subtotal = document.getElementById('subtotal').value;
var vat = parseFloat(parseFloat(subtotal) * parseFloat(0.2)).toFixed(2);
var total = parseFloat(parseFloat(subtotal) + parseFloat(vat)).toFixed(2);

document.getElementById('vat').value = vat;
document.getElementById('total').value = total;
}

我看不到我要去哪里错了。 当我在“小计”输入字段中输入10时,“增值税”和“总计”字段分别更改为2和12。但是我希望它们显示2.00和12.00。 屏幕截图如下:

在此处输入图片说明

解:

当使用Firefox时,类型=“ number”的输入字段似乎无法用于javascript计算。 解决方法是将其更改为type =“ text”,如下面提到的J Santosh一样,并且可以使用。

发现了问题。 它与<input type='number'>更改为<input type='text'>

工作小提琴

输入类型编号不接受小数

参考-1

参考2

这是你想要的吗? 如果是这样,那您就很近了。 您只需要添加

document.getElementById('subtotal').value = parseFloat(subtotal).toFixed(2);

以及您的代码。

 function vatCalculation() { var subtotal = document.getElementById('subtotal').value; var vat = parseFloat(parseFloat(subtotal) * parseFloat(0.2)).toFixed(2); var total = parseFloat(parseFloat(subtotal) + parseFloat(vat)).toFixed(2); document.getElementById('subtotal').value = parseFloat(subtotal).toFixed(2); document.getElementById('vat').value = vat; document.getElementById('total').value = total; } 
 <input name="subtotal" id="subtotal" type="text" maxlength="20" min="0" placeholder="00.00" onchange="vatCalculation();" /> <input name="vat" id="vat" type="text" maxlength="20" min="0" placeholder="00.00" readonly="true" /> <input name="total" id="total" type="text" maxlength="20" min="0" placeholder="00.00" readonly="true" /> 

(2.399).toFixed(2); 会给你2.40

但如果您需要2.39,请尝试

parseInt(2.399 * 100)/100

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM