Result
jQuery
$("#myTable").on('input', '.txtCal', function () { var calculated_total_sum = 0; $("#myTable .txtCal").each(function () { var get_textbox_value = $(this).val(); if ($.isNumeric(get_textbox_value)) { calculated_total_sum += parseFloat(get_textbox_value); } }); $("#total_sum_value").html(calculated_total_sum); });
複数inputに入力された数値の合算を出します。
簡易的な見積もりとかデータを扱う時に使えそうでしょうか
html
<table id="myTable"> <tr> <th width="100">品名 </th> <th>金額</th> </tr> <tr> <td><span>なし:</span></td> <td><input type="text" class='txtCal' />円</td> </tr> <tr> <td><span>りんご :</span></td> <td><input type="text" class='txtCal' />円</td> </tr> <tr> <td><span>パイン :</span></td> <td><input type="text" class='txtCal' />円</td> </tr> <tr> <td><span>ぶどう :</span></td> <td><input type="text" class='txtCal' />円</td> </tr> <tr> <td><span>みかん :</span></td> <td><input type="text" class='txtCal' />円</td> </tr> <tr> <td><span><b>合計 :</b></span></td> <td><b><span id="total_sum_value"></span>円</b></td> </tr> </table>
via
jQuery: Calculate Sum Of all Textbox Values In a Table Column