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