Автоматическое вычисление для общего произведения двух столбцов - включает строки динамической таблицы

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>

Здесь я пытаюсь выполнить то, что мне нужно обновить значение product для поля total_weight на основе типа значений в amount и weight fields каждый раз, когда 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 ...

// 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);
    });
});