javascript - 使用类名称计算类别部分的小计

Question

我正在做一个基于Excel电子表格的项目，我需要计算预算等。我的表格中有各种类别，我需要计算每个类别的小计。这是一个屏幕截图，可以更清楚地显示: /image/kVunw.png

我的问题是，我不确定如何计算每个类别的小计。现在，我有 $('.subcat100 .budget').each(function()。类“subcat100”附加到 tr 并针对每个类别部分(subcat100、subcat200、subcat300 等)进行更改。数值值基于数据库中存储的子类别号。我如何提取所有这些类并迭代它们？

jQuery:

    $(document).ready(function() {

        $('input[name="txtQuantity[]"],input[name="txtUnitCost[]"]').change(function(e) {
            var budget = 0;
            var $row = $(this).parent().parent();
            var quanity = $row.find('input[name="txtQuantity[]"]').val();
            var unitcost = $row.find('input[name="txtUnitCost[]"]').val();
            budget = parseFloat(quanity * unitcost);
            var decimal = budget.toFixed(2);
            $row.find('.budget').val(decimal);

            var sum = 0;
            $('.subcat100 .budget').each(function() {
                var budgets = $(this).val();
                console.log(budgets);
                if (IsNumeric(budgets)) {
                    sum += parseFloat(budgets, 10);
                }
            });
            $('.subcat100 .budgetsubtotal').val(sum);
        });

        function IsNumeric(input) {
            return (input - 0) == input && input.length > 0;
        }

    });

HTML:

    <table>
        <tbody>
            <tr class="subcat100">
                <td>
                    <span name="txtItemCode[]"><strong>100</strong></span>
                </td>
                <td colspan="7">
                    <span name="txtSubCategoryName[]" class="100"><strong>Land Purchase Costs</strong></span>
                </td>
            </tr>
            <tr class="subcat100">
                <td>
                    <input type="text" name="txtSubItemCode[]" size="10" readonly="readonly" value="101">
                </td>
                <td>
                    <input type="text" name="txtItem[]" size="50" readonly="readonly" value="Purchase price">
                </td>
                <td>
                    <input type="text" name="txtUnit[]" size="10" value="">
                </td>
                <td>
                    <input type="text" name="txtQuantity[]" class="integer" size="10" value="1">
                </td>
                <td>
                    <input type="text" name="txtUnitCost[]" class="monetary" size="10" value="299.99">
                </td>
                <td>
                    <input type="text" name="txtBudget[]" class="monetary budget" size="10" readonly="readonly" value="299.99">
                </td>
                <td>
                    <input type="text" name="txtActual[]" class="monetary" size="10" value="249.99">
                </td>
                <td>
                    <input type="text" name="txtDifference[]" class="monetary difference" size="10" readonly="readonly" value="50.00">
                </td>
            </tr>
            <tr class="subcat100">
                <td>
                    <input type="text" name="txtSubItemCode[]" size="10" readonly="readonly" value="110">
                </td>
                <td>
                    <input type="text" name="txtItem[]" size="50" readonly="readonly" value="Realtor's fees">
                </td>
                <td>
                    <input type="text" name="txtUnit[]" size="10" value="">
                </td>
                <td>
                    <input type="text" name="txtQuantity[]" class="integer" size="10" value="">
                </td>
                <td>
                    <input type="text" name="txtUnitCost[]" class="monetary" size="10" value="">
                </td>
                <td>
                    <input type="text" name="txtBudget[]" class="monetary budget" size="10" readonly="readonly" value="">
                </td>
                <td>
                    <input type="text" name="txtActual[]" class="monetary" size="10" value="">
                </td>
                <td>
                    <input type="text" name="txtDifference[]" class="monetary difference" size="10" readonly="readonly" value="">
                </td>
            </tr>
            <tr class="subcat100">
                <td>
                    <input type="text" name="txtSubItemCode[]" size="10" readonly="readonly" value="120">
                </td>
                <td>
                    <input type="text" name="txtItem[]" size="50" readonly="readonly" value="Due diligence">
                </td>
                <td>
                    <input type="text" name="txtUnit[]" size="10" value="">
                </td>
                <td>
                    <input type="text" name="txtQuantity[]" class="integer" size="10" value="15">
                </td>
                <td>
                    <input type="text" name="txtUnitCost[]" class="monetary" size="10" value="45.00">
                </td>
                <td>
                    <input type="text" name="txtBudget[]" class="monetary budget" size="10" readonly="readonly" value="675.00">
                </td>
                <td>
                    <input type="text" name="txtActual[]" class="monetary" size="10" value="700.00">
                </td>
                <td>
                    <input type="text" name="txtDifference[]" class="monetary difference" size="10" readonly="readonly" value="-25.00">
                </td>
            </tr>
            <tr class="subcat100">
                <td colspan="5">
                    <span><strong>Subtotal</strong></span>
                </td>
                <td>
                    <input type="text" name="txtSubTotalBudget[]" class="budgetsubtotal" size="10" readonly="readonly" value="">
                </td>
                <td>
                    <input type="text" name="txtSubTotalActual[]" class="actualsubtotal" size="10" readonly="readonly" value="">
                </td>
                <td>
                    <input type="text" name="txtSubTotalDifference[]" class="differencesubtotal" size="10" readonly="readonly" value="">
                </td>
            </tr>
        </tbody>
    </table>

Answer 1

好吧，我最终这样做了:

    var itemcodes = <?php echo json_encode($arrItemCodes);?>;

    $('input[name="txtQuantity[]"],input[name="txtUnitCost[]"]').change(function(e) {
        var budget = 0;
        var $row = $(this).parent().parent();
        var quanity = $row.find('input[name="txtQuantity[]"]').val();
        var unitcost = $row.find('input[name="txtUnitCost[]"]').val();
        budget = parseFloat(quanity * unitcost);
        $row.find('.budget').val(budget.toFixed(2));

        $.each(itemcodes, function(intIndex, objValue) {
            var sum = 0;
            $('.subcat' + objValue + ' .budget').each(function() {
                var budgets = $(this).val();
                console.log(budgets);
                if (IsNumeric(budgets)) {
                    sum += parseFloat(budgets, 10);
                }
            });
            $('.subcat' + objValue + ' .budgetsubtotal').val(sum.toFixed(2));
        });
    });

接受其他建议!