自动计算两列的总产品 - 涉及动态表行

Question

考虑以下HTML表格：

<table id="myTable1">
    <tr id="TR1">
        <td><input type="text" id="quantity1" name="quantity1" /></td>
        <td><input type="text" id="weight1" name="weight1" /></td>
    </tr>
</table>

<table id="myTable2">
   <td><input type="text" id="total_weight" name="total_weight" /></td>
</table>

我在这里要完成的是，我需要根据数量<中的值类型更新 total_weight 字段的产品值/ strong>和权重字段每次在最后两个提到的字段上触发 keyup（）。所以基本上这就像 total_weight + =（数量*重量）。

现在预计 myTable1 将包含多行，因为标题声明， myTable1 是一个动态表格，以便用户可以在印刷机上添加/删除行按钮---我已经实现的功能。

我有以下代码计算 total_weight ，但不包括数量列。我只需要弄清楚如何插入数量以与那里的重量相乘：

// Auto-compute (total weight)
$('#myTable1 input[id^=\'weight\']').live('keyup',function() {
    var total_weight = 0;

    $('#myTable1 input[id^=\'weight\']').each(function(index, value) {
        total_weight += Number($(this).val());

        $('#myTable2 #total_weight').val(total_weight);
    });
});

Answer 1

你的代码非常接近。使用此js ...

查看此fiddle

// Auto-compute (total weight)
$('#myTable1 input[id^=weight], #myTable1 input[id^=quantity]').live('keyup',function() {
    var total_weight = 0;

    $('#myTable1 input[id^=weight]').each(function(index, value) {
        var n = $(this).attr('id').substr(6);
        total_weight += (Number($(this).val()) * Number($('#quantity' + n).val()));
        $('#myTable2 #total_weight').val(total_weight);
    });
});