Question

我创建了此表单以使用户能够获得引用：

    <form name="autoSumForm">
<br><br>
Width: <input class="right" type="text" name="firstBox" value="" onBlur="stopCalc();"><br>
Height: <input class="right" type="text" name="secondBox" value="" onBlur="stopCalc();"><br>
Type: <select class="right" name="thirdBox" onfocus="startCalc();" onblur="stopCalc();">
        <option selected="selected">-</option>
        <option value="7.80">Forex bianco 3 mm</option>
        <option value="8.30">Forex bianco 5 mm</option>
        <option value="9.90">Forex bianco 10 mm</option>
        <option value="5.70">Forex piuma 10 mm</option>
    </select><br>
Total cost: <input class="right" type="text" name="fourBox">
</form>

我写了一些js来计算总费用：

function startCalc(){
  interval = setInterval("calc()",1);
}
function calc(){
  one = document.autoSumForm.firstBox.value;
  two = document.autoSumForm.secondBox.value;
  three = document.autoSumForm.thirdBox.value;
  document.autoSumForm.fourBox.value = (one * 1) * (two * 1) * (0.0001) * (three * 1);
}
function stopCalc(){
  clearInterval(interval);
}
function roundNumber(number, decimals){
    var newnumber = new Number(fourBox).toFixed(parseInt(decimals));
    document.autoSumForm.fourbox.value =  parseFloat(newnumber);
}

现在的问题是：每次填写表单时，结果都是逗号后面有多位数的数字，我尝试了很多东西，但没有一个好的... 请帮忙！谢谢!!!

PS我知道这类工作的服务器方面更好，但它是一个简单的网站，每个订单都由一个人处理。

Answer 1

好吧，我不是百分之百确定你想要计算什么，但这里有一些我认为你可能想要实现的变化，如果没有那么它至少可以让你朝着正确的方向前进。顺便说一下，最好使用“id”而不是“name”来识别元素，因为“id”必须是唯一的。

HTML

<form name="autoSumForm">
    <br>
    <br>Width:
    <input class="right" type="text" name="firstBox" value="">
    <br>Height:
    <input class="right" type="text" name="secondBox" value="">
    <br>Type:
    <select class="right" name="thirdBox">
        <option selected="selected">-</option>
        <option value="7.80">Forex bianco 3 mm</option>
        <option value="8.30">Forex bianco 5 mm</option>
        <option value="9.90">Forex bianco 10 mm</option>
        <option value="5.70">Forex piuma 10 mm</option>
    </select>
    <br>Total cost:
    <input class="right" type="text" name="fourBox" value="0.00">
</form>

的Javascript

var firstBox = document.querySelector("[name='firstBox']");
var secondBox = document.querySelector("[name='secondBox']");
var thirdBox = document.querySelector("[name='thirdBox']");
var fourBox = document.querySelector("[name='fourBox']");

function update() {
    fourBox.value = ((parseFloat(firstBox.value) * parseFloat(secondBox.value) * 0.0001 * parseFloat(thirdBox.value)) || 0).toFixed(2);
}

firstBox.addEventListener("keyup", update, false);
secondBox.addEventListener("keyup", update, false);
thirdBox.addEventListener("change", update, false);

在jsfiddle

上

关于parseFloat vs unary plus operator

的评论

一般情况下，一元加运算符可能更快（何时？），但在最流行的两种浏览器（Chrome和firefox）上，jsperf表明parseFloat更快

我认为parseFloat显示意图更清晰，预先挂起“+”，更短的代码并不总是更好的代码

转换字符串时，这两种方法之间也存在差异，请考虑此jsfiddle

JS - 实时舍入的数字

1 个答案: