Question

我正在构建一个接口，用于在检查输入时计算总数（基于相邻输入）。检查输入时，我会在同一<td>中获取其他输入的值，然后构建总计。

我需要为所有选中的复选框构建总计（按名称分组）的摘要，而我似乎无法找到正确的路径来解决这个问题。

因此，如果您要检查前3行（2个foos和1个bar），我希望输出看起来像这样：

FOO: 100  
BAR: 30

这是我的HTML：

<table id="test">
    <tr>
        <td>
            <input type="checkbox" name="id" size="20" value="100" />
            <input type="text" name="name" size="20" value="FOO" />
            <input type="text" name="cost" size="20" value="10.00">
            <input type="text" name="quantity" size="20" value="1">
        </td>
    </tr>
    <tr>
        <td>
            <input type="checkbox" name="id" size="20" value="200" />
            <input type="text" name="name" size="20" value="BAR" />
            <input type="text" name="cost" size="20" value="10.00">
            <input type="text" name="quantity" size="20" value="3">
        </td>
    </tr>
    <tr>
        <td>
            <input type="checkbox" name="id" size="20" value="300" />
            <input type="text" name="name" size="20" value="FOO" />
            <input type="text" name="cost" size="20" value="10.00">
            <input type="text" name="quantity" size="20" value="9">
        </td>
    </tr>
</table>

jQuery的：

// when the id checkbox is clicked
$('table').delegate('input[name=id]', 'click', function(){

    // set the total at 0
    var totalCost = 0;

    // loop through each checked line
    $('input[name=id]:checked').each(function(){

       // get the input values for this checked row
       var thisRow = $(this).parent(), 
           person = thisRow.find('input[name=name]').val(),
           qty = thisRow.find('input[name=quantity]').val(),
           cost = thisRow.find('input[name=cost]').val();

       // get total
       var lineCost = cost * qty;

       // add to the grand total 
       totalCost+=parseFloat(lineCost);

    });

    // output the total cost
    $('#output').empty().append(totalCost);

});

我应该构建数组还是对象？我基本上只需要获取已经检查过的所有名称，并显示每个名称的总计。我只需要一个正确的方向。

Answer 1

你应该构建一个对象，只要不需要真正的排序。

在您的总数之后，您可以拥有以下这些行：

totalCost += parseFloat(lineCost);

if(totals[person] == null) {
    totals[person] = 0;
}

totals[person] += totalCost;

您还需要定义：

var totals = {};

这将超越你的循环。

Answer 2

这样的事情怎么样？

http://jsfiddle.net/vdunm/2/

它基本上只是构建一个具有单独分组总数的对象。

我应该使用数组或对象来构建摘要吗？

2 个答案: