获取每行的文本框字段值的总和

Question

我在这里使用php购物车。我添加了一个脚本来获取所有输入字段的总和。我需要做的是获得每行所有季度的总和。问题是所有的总字段都获得了行的总和值。我如何得到每行的总和？

<script type="text/javascript">
$('.qtys').blur(function() {
    var sum = 0;
    $('.qtys').each(function() {
    sum += Number($(this).val());
    });
    $('.qty_total').val(sum);
});
</script>

while($obj = $results->fetch_object())
{
<td><input type="text" name="product_qty" size="1" class="qty_total"/></td>
<td><input type="text" name="qty1st" size="1" class="qtys"/></td>
<td><input type="text" name="qty2nd" size="1" class="qtys"/></td>
<td><input type="text" name="qty3rd" size="1" class="qtys"/></td>
<td><input type="text" name="qty4th" size="1" class="qtys"/></td>
}

Answer 1

选择器$('.qty_total')将为您调用具有类qty_total的元素，但您只需要当前行中的一个元素。使用当前行中的qty_total。你可以获得父行$(this).closest('tr')然后你可以使用qty_total找到find()

同时使用$(this).closest('tr').find('.qtys').each代替$('.qtys').each(function()

<强> Live Demo

您的代码

<script type="text/javascript">
$('.qtys').blur(function () {
    var sum = 0;
    $(this).closest('tr').find('.qtys').each(function () {
        sum += Number($(this).val());
    });
    $(this).closest('tr').find('.qty_total').val(sum);
});
</script>

Answer 2

选中 Demo Fiddle

<script type="text/javascript">
$('.qtys').blur(function() {
    var sum = 0;
    $(this).closest('tr').find('.qtys').each(function() {   //.qtys of current row,
    sum += Number($(this).val());
    });
    $(this).closest('tr').find('.qty_total').val(sum);     // total of current row
});
</script>

您需要当前行的Quarter值。 $(this).closest('tr')为您提供当前<tr>的{​​{1}}父级。因此，选择器将更新当前行的值，而不是您先前代码所执行的所有行。

您的所有操作都需要处理正在操作的当前行。 .closest('tr') 有助于仅操纵当前行的子元素。

替代：<td>

Answer 3

这是做到这一点的方法：

//gets the inputs in the correct row
$(this).parent('tr').children('.qtys').each(function(){

    //sums it
    totalSum=totalSum+$(this).val();

    //puts it in the total input
    $(this).parent('tr').children('td:nth-child(3)').children('input').val(totalSum);
});