具有动态字段的 JavaScript 数学

Question

我有一张表格，上面有学校类(class)。此表单上可以有任意数量的类，每个类有 2 个字段。书本费和学费。

我有一个名为总计的第三个字段，当他们在其他字段中输入成本时，我想更新该字段。

这就是我的设置方式:

    $(document).on( "keyup", ".cost", function(){
        theCost = parseFloat($(this).val(), 2) || 0;
        grandTotal(theCost);
    });


    // Calculate the total
    function grandTotal(theCost){
        totalCost = (totalCost + theCost);
        console.log(totalCost);
    }

由于这在每个按键上运行，因此如果我输入 44 它只会添加 4+4。

是否有更好的方法来获取字段的值而不是输入的每个数字？

Answer 1

这取决于您的界面以及您希望它如何工作。

.blur当输入失去焦点时会触发。您可以收听keyup或keydown如果您想这样做，请匹配[Enter]键，或者您可以将其绑定(bind)到特定按钮。没有一个包罗万象的答案。

还有一件事值得注意 - 你 shouldn't bind events to the document在多数情况下。找到一个距离您的输入不太远的合理父元素，使其能够冒泡，然后绑定(bind)到该元素。一个稍微好一点的例子是 $('form').on('keyup', '.cost'...因此事件可以限制为 <form>在大多数页面中相对稀疏。