Question

我正在制作一份简单的订单表格，供批发使用，显示实时更新的总数。每行的价格保持不变。这是我到目前为止的地方：

但是，无论何时输入新数量，总更新都会显示该特定数量的总数。因此，如果我们添加1 - 0mg Honey Suckle和2 - 3mg Honey Suckle，则总数应为3 * 5 = 15.但是现在它只计算输入的最后数量 - 如果这是有意义的。

我是如何才能让它正常运作的？这是我现有的jQuery：

function getTotal(){
    var total = 0;
    $('.sum').each(function(){
        total += parseFloat(this.innerHTML)
    });
    $('#total').text(total);
}

getTotal();

$('.qty').keyup(function(){
    var parent = $(this).parents('tr');
    var price = $('.price', parent);
    var sum = $('.sum', parent);
    var value = parseInt(this.value) * parseFloat(price.get(0).innerHTML||0);
    sum.text(value);
    getTotal();
})

Answer 1

您可以使用以下方法简化它：

$('.qty').keyup(function () {
    var rowSum = 0;
    $(this).closest('tr').find('input.qty').each(function () {
        if (this.value.length) rowSum += parseInt(this.value, 10);
    })
    var rowPrice = $(this).closest('tr').find('td.price').text();
    $(this).closest('tr').find('td.sum').text((rowSum * rowPrice).toFixed(2))
})

<强> jsFiddle example

您没有正确地迭代输入，只保留最后一个值。

jQuery - 在单个表行中显示多个数量的总计

1 个答案: