动态添加Jquery中的字段总和 [英] Dynamically adding the sum of field in Jquery

问题描述

当文本字段更改时，我想使用表中的jquery添加一周中的总小时数，所以div的总数total_amount应该更新，但似乎不起作用.

I'd like to add the sum of hours in a week using jquery from a table, when text fields change the total in div total_amount should be updated, but it doesn't seem to be working.

$(function() {
$("[id$=day]").change(function() {

var total = 0;
$('table input[id$=day]').each(function() {
    var sum_id = this.id;
    total[this.value] += parseInt($('#' + sum_id).val(), 10);
});

    $('div.total_amount').html(total);
});
});

HTML在这里

<td class="timesheet2"><input type="text" name="daymon" id="monday">
</td>

<td class="timesheet2"><input type="text" name="daytue" id="tuesday">
</td>

<td class="timesheet2"><input type="text" name="daywed" id="wednesday">
</td>

<td class="timesheet2"><input type="text" name="daythurs" id="thursday">
</td>

<td class="timesheet2"><input type="text" name="dayfri" id="friday">
</td>

<td class="timesheet2"><input type="text" name="daysat" id="saturday">
</td>

<td class="timesheet2"><input type="text" name="daysun" id="sunday">
</td>

<td class="timesheet"><div id="total_amount"></div>
</td>

推荐答案

显示最终值时遇到问题.需要ID时，您正在使用类选择器.

You had a problem showing the final value. You were using a class selector when you needed an ID.

http://jsfiddle.net/YE5vF/2/

HTML

<table>
<tr>
<td class="timesheet2"><input type="text" name="daymon" id="monday"></td>
<td class="timesheet2"><input type="text" name="daytue" id="tuesday"></td>
<td class="timesheet2"><input type="text" name="daywed" id="wednesday"></td>
<td class="timesheet2"><input type="text" name="daythurs" id="thursday"></td>
<td class="timesheet2"><input type="text" name="dayfri" id="friday"></td>
<td class="timesheet2"><input type="text" name="daysat" id="saturday"></td>
<td class="timesheet2"><input type="text" name="daysun" id="sunday"></td>
<td class="timesheet"><div id="total_amount"></div></td>
</tr>
</table>

JS

$("[id$=day]").change(function() {
    var total = 0;     
    $('.timesheet2 input').each(function() {
        total = total + Number( $(this).val() );
    });
    $('div#total_amount').html(total); 
});

这篇关于动态添加Jquery中的字段总和的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！