使用 javascript 和多个 html 字段的数学答案

【问题标题】：Maths using javascript and multiple html fields使用 javascript 和多个 html 字段的数学
【发布时间】：2012-04-26 01:13:38
【问题描述】：

我有一个脚本可以根据数据库查询动态创建具有不同数量的列和行的表。这在两个不同的数据库表上完成了两次。我在每个表的底部都有一行，输入的值是上列中单元格的总和。这些输入被命名为itotal$m（其中$m 是一个递增的数字）用于第一个表，etotal$m 用于第二个表。所以我最终得到的是一些输入字段，其中第一行总计名称为 itotal1、itotal2 等，第二行总计名称为 etotal1、etotal2 等。

我想对这些总数执行一些简单的数学运算，从itotal1 中减去etotal1，从itotal2 中减去etotal2 等等，然后在另一个输入中显示结果。我想使用附加到 onChange 事件的 javascript 函数，以便用户可以更改输入框的值并查看结果。

不幸的是，我还没有弄清楚如何做到这一点。任何帮助将不胜感激！

【问题讨论】：

你能发布你的 HTML 吗？或者更好的是，创建一个 JSFiddle？

标签： php javascript jquery sum

【解决方案1】：

假设：

有id="iTable" 和id="eTable" 的两个表，
所有列总计字段都具有class="colTotal"，
两个表要一致（即它们的列顺序相同），
目标输入元素有class="diffValue"，然后：

jQuery:

$(function(){
    var $iTableTotals = $("#iTable .colTotal");
    var $eTableTotals = $("#eTable .colTotal");
    var $diffValues = $(".diffValue");
    $(".colTotal").on('change keyup', function() {
        $iTableTotals.each(function(i){
            var diff = Number($iTableTotals.eq(i).val()) - Number($eTableTotals.eq(i).val());
            $diffValues.eq(i).val(diff);
        });
    });
    $iTableTotals.eq(0).change();
});

见fiddle

【讨论】：