javascript - 对 MVC 编辑表单上的 2 个字段动态求和

Question

我有一个 MVC 编辑表单，其中包含 2 个名为 ExVAT 和 VAT 的字段。我想添加另一个字段来包含这两个值的总和。

目前，我所显示的是加载表单时 2 个字段的总数。但是，如果您要更改其他字段之一，则总计不会更新以反射(reflect)新的总计。

例如下面的屏幕截图:

我已将增值税数字从 22 更改为 32，但总数尚未更新(当值正确时我将处理格式)

获取总数的代码是:

@Html.Raw(Model.Vat + Model.ExVat)

在编辑其他字段时更新总字段的最佳方法是什么？

Answer 1

JSFiddle:https://jsfiddle.net/3tnjtLv5/1/

<div>
    <div><input id="txtA" type="text" value="1"></div>
    <div><input id="txtB" type="text" value="2"></div>
    <div id="txtResult">
</div>

<script>
    var txtA=$('#txtA');
    var txtB=$('#txtB');
    var txtResult=$('#txtResult');

    function updateSum() {
      txtResult.html(parseInt(txtA.val()) + parseInt(txtB.val()));
    }

    $(function() {
      updateSum();
      txtA.change('change', updateSum);
      txtB.bind('change', updateSum);
    });
</script>