仅计算相关行的总和

Question

所以我有几个小时无法解决的问题..

当我按下按钮“Pridėtiprekę”时，一行会动态添加到表中，当我在“ Kiekis”和“ Kaina”列中写数字时，“ Suma”列中什么也不会发生（仅发生在动态添加的行中）。

一块jQuery：

$(document).on('keyup', '#quantity, #price', function() {
    $('#total').val(($('#quantity').val() * $('#price').val()).toFixed(2));
});

请查看JSFiddle，它如何“工作”我的代码：

https://jsfiddle.net/w5qz5exe/7/

预先感谢您的帮助！

PS我试图将div ID total更改为div class total，然后起作用了，但是它适用于所有行，而不适用于相关行。

Answer 1

您正在引用带有ID的所有内容。

    $(document).on('keyup', '.quantity, .price', function() {
        var row = $(this).closest('tr');
        var rowPrice = $(row).find('.price').val();
        var rowQuantity = $(row).find('.quantity').val();

        $(row).find('.total').val( (rowPrice * rowQuantity).toFixed(2) )
    });

https://jsfiddle.net/w5qz5exe/12/

Answer 2

您的问题是输入正在使用id代替其他东西。 查找有问题的项目时，搜索将在找到的第一个ID处停止。

这个更新的小提琴https://jsfiddle.net/w5qz5exe/11/显示了如何使用类来完成。

        $(document).on('keyup', '.quantity, .price', function(e) {
            var $parent = $(e.target).parents('tr'),
                $total = $parent.find('.total'),
                $quantity = $parent.find('.quantity'),
                $price = $parent.find('.price');
            $total.val(($quantity.val() * $price.val()).toFixed(2));
        });

除上述内容外，从输入中删除所有Id，并将其更改为类。