jquery - 使用jquery函数返回列总数

Question

在以下代码中，我使用studentName和显示列feeAmount。然后，最后，我尝试添加 的金额feeAmount，但 jQuery 函数没有返回总金额。

<div id="studentContent"  >
    <script id="studentTemplate" type="text/x-jquery-tmpl"> 
        <form id="studentForm" action ="">
            <table  class=""  border="1" cellpadding="0" cellspacing="0">
                <tbody>
                    {{#each items}}
                        <tr class="">
                            <td>{{=studentName}}</td>
                            <td><input type="text" class="{{=id}}" id="{{=id}}"
                   value='{{=feeAmount}}' /></td>
                        </tr>
                    {{/each}} 
                    <tr>
                        <td><input id="totalFeeAmount" value="a" /></td>
                    </tr>
                    <tr>
                </tbody>           
            </table>            
        </form>
    </script>
</div>

$(document).ready(function () {
    $("#studentForm").html(function () {
        var totalFeeAmount = 0;
        $(".feeAmount").each(function () {
            totalFeeAmount += parseInt($(this).html())
        });
        return totalFeeAmount;
    });
});

请让我知道如何修复函数以返回和显示列的总数。

Answer 1

您需要设置totalFeeAmount输入字段的值，而不是更改完整的表单内容

$(document).ready(function () {
    $("#totalFeeAmount").val(function () {
        var totalFeeAmount = 0;
        $(".feeAmount").each(function () {
            totalFeeAmount += (parseInt($(this).html()) || 0)
        });
        return totalFeeAmount;
    });
});

或者

$(document).ready(function () {
    var totalFeeAmount = 0;
    $(".feeAmount").each(function () {
        totalFeeAmount += (parseInt($(this).html()) || 0)
    });
    $("#totalFeeAmount").val(totalFeeAmount);
});