使用腳本添加兩個相同名稱的數組值

Question

我需要將a和b的兩個值相乘並在c中顯示。 我還需要使用腳本顯示c的附加值。 請在下面檢查我的代碼：

HTML：

        <table border="1" id="table" class="table">
            <tr>
                <th>a</th>
                <th>b</th>
                <th>c</th>
            </tr>

                <?php
                $select= "SELECT * from table where id=1";
                            $result = mysql_query($select);
                            $row_count=1;
                            while($row = mysql_fetch_assoc($result))
        {
                ?>  
<tr>    
            <td><input type="text" value="<?php echo $row['name_a']; ?>" name="name_a[]" class="name_a"></td>
            <td><input type="text" value="<?php echo $row['code_a']; ?>" name="code_a[]" class="code_a"></td>
            <td><input type="text" name="id_a[]" class="id_a" ></td>
</tr>
        <?php
        $row_count++;
        }
        ?>

</table>
    <input type="text" name="total" class="total">

腳本：

$(document).ready(function() {
    $('#table').on('keyup', '.name_a', cal)
        .on('keyup', '.code_a', cal)
        .on('keyup', '.id_a', cal);

    function cal() {
        var $row = $(this).closest('tr'),
        name_a = $row.find('.name_a').val(),
        code_a = $row.find('.code_a').val(),
        id_a = $row.find('.id_a').val(),
        id_a_calc = name_a * code_a;

        $row.find('.id_a').val(id_a_calc)

    }
});

輸出值

a   b   c 
1   2   2
2   4   8

通過上面的腳本，我可以將a和b相乘並在c中顯示，但是如何將'c'的兩個值相加並在總文本框中顯示。

Answer 1

嘗試這個：

 $(document).ready(function() {
        $('#table').on('keyup', '.name_a', cal)
            .on('keyup', '.code_a', cal)
            .on('keyup', '.id_a', cal); 
    });

    function cal() {
        var $row = $(this).closest('tr'),
        name_a = $row.find('.name_a').val(),
        code_a = $row.find('.code_a').val(),
        id_a = $row.find('.id_a').val(),
        id_a_calc = name_a * code_a;

        $row.find('.id_a').val(id_a_calc);
        var total = 0;
        $(".id_a").each(function() {
           // console.log($(this).val());
            if($(this).val().length > 0){
            total += parseInt($(this).val(), 10);
            }
        });
        $(".total").val(total);

    }

Answer 2

在更新$row.find('.id_a').val()之后，將其放入cal

var total = 0;
$(".id_a").each(function() {
    total += parseInt($(this).val(), 10);
});
$(".total").text(total);

Answer 3

試試這個代碼：

$(document).ready(function() {
    $("#btn").click(function() {
        var cValue = 0;
        $('#table tr td:nth-child(3)').each(function() { 
            cValue += parseInt($(this).html());
        });
        $("#total").val(cValue)
    }); 
});

jsfiddle示例：-http: //jsfiddle.net/c2S5d/21/