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

Question

我正在为批发使用做一个简单的定单，它显示实时更新的总数。每行价格保持不变。这是我目前所处的位置：

http://jsfiddle.net/80sgr4xr/

然而，现在，每当输入一个新的数量时，总更新将显示该特定数量的总计。所以，如果我们加了1毫克蜂蜜和2-3毫克蜂蜜，总数应该是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实例

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