Question

我有一个PHP页面，可以从MySQL填充HTML表格。它输出两个单独的表，ID为'headTable'和'visits'。我试图将'visit'表中的值相加并将总和输出到相应的'headTable'。还有一个填充输入字段的复选框，我在检查所有复选框时也无法获得正确的总和。如果我手动输入值，总和是正确的。提前致谢。 Here is an Example on Fiddle

<table id="headTable">
    <tr>
        <th>First Table</th>
        <th><span id="appliedTotal"></span></th>
    </tr>
</table>

<table id="visits">
    <tr>
        <td>Jane</td>
        <td>18.45</td>
        <td><input type="checkbox"></td>
        <td><input class="amount" type="text" size="20" value=""></td>
    </tr>
    <tr>
        <td>Peter</td>
        <td>100</td>
        <td><input type="checkbox"></td>
        <td><input class="amount" type="text" size="20" value=""></td>
    </tr>
</table>

<table id="headTable">
    <tr>
        <th>Second Table</th>
        <th><span id="appliedTotal"></span></th>
    </tr>
</table>

<table id="visits">
    <tr>
        <td>Ronald</td>
        <td>100</td>
        <td><input type="checkbox"></td>
        <td><input class="amount" type="text" size="20" value=""></td>
    </tr>
    <tr>
        <td>John</td>
        <td>100</td>
        <td><input type="checkbox"></td>
        <td><input class="amount" type="text" size="20" value=""></td>
    </tr>
</table>

和我的Jquery

<script>

$(document).ready(function(){
    $(function() {

        $('table input[type="checkbox"]').change(function() {
            var input = $(this).closest('td').next('td').find('input');

            if ($(this).is(':checked')) {
                var amount = $(this).closest('td').prev('td').text();
                var sum = 0;

                $.each($('table#visits'), function() {
                    $('.amount').each(function() {
                        sum += Number($(this).val());
                        $('#appliedTotal').html('$'+sum.toFixed(2));
                    });
                });

                input.val(amount);

            } else {
                input.val('0.00');
                var sum = 0;

                $('.amount').each(function() {
                    sum += Number($(this).val());
                    $('#appliedTotal').html('$'+sum.toFixed(2));
                });

            }
        });
    });

    $.each($('table#visits'), function() {
        $(".amount").keyup(function() {
            var sum = 0;

            $('.amount').each(function() {
                sum += Number($(this).val());
                $('#appliedTotal').html(sum);
            });
        });
    });

});
</script>

这就是我要做的事。

JSFiddle Example

Answer 1

是关于如何用美元来制作数字？我更喜欢相反，但对于你的情况，在将它传递给Number（）之前将substring（1）添加到.val（）

和a sum ='$'+总和在分配给当然的appliedTotal之前

Answer 2

你不能在一个页面上有两个表或任何其他具有相同“id”的标签。

Jquery sum表单输入多个表

2 个答案: