我需要在ajax响应后获得选中复选框上的复选框点击与jquery的总和值。
$('.check:checked').each(function() { });
如果我在页面加载时调用复选框，上面的jQuery函数就会工作但是我必须在AJAX响应后调用这个函数，它不起作用。
所以我尝试了以下一个，但不知道如何获得所选复选框值
的总和$('body').on('click', '.check', function(){ }
<script>
$(document).ready(function(){
$('body').on('click', '.check', function(){
var tot = 5;
$('.check:checked').each(function() {
console.log($(this).val());
tot += $(this).val();
});
console.log(tot);
});
$('#payType').change(function(){
var pType = $(this).val();
var y = $('[name = "year"]').val();
clearRuntimeFunctions();
$('#payType').val(pType);
if(pType != "dntSntReqst"){
$('#ajax_img_lod').show();
$.ajax({
url: 'AJAX_Requst/getOtherPaymt.php',
type: 'POST',
data: {
'pYear': y,
'payType': pType,
},
success: function( data ){
$('#ajax_img_lod').hide();
$('#ajax_response').html(data);
}
});
}
});
});
</script>
这是一个AJAX响应页面
<?php
<table class="table table-message" style="margin: 10px 25px;max-width: 350px;">
<tbody>
<tr class="heading">
<td class="cell-title"> Year </td>
<td class="cell-title"> Month </td>
<td class="cell-title"><div align="right"> Amount </div></td>
<td class="cell-title"><div align="right"> Balance</div> </td>
<td class="" width="2%"><div align="right"></div></td>
</tr>
foreach($monthEnd_Arry as $m)
{
$sql_cls = mysql_query("SELECT book FROM cls_room_tb WHERE cls_brnch_id='$br_id' AND start_date <= '$m'");
$noCls = mysql_num_rows($sql_cls);
if ($noCls > 0) {
if ($noCls <= 4) {
$centFee = $noCls * 1000;
}
else {
$centFee = 4 * 1000;
$centFee += ($noCls - 4) * 500;
}
$sql_paid = mysql_query("SELECT SUM(amount) FROM other_payments WHERE br_id='$br_id' AND pay_type='$payType' AND
pYear = '$pYear' AND pMonth='". substr($m , 5, 2)."'");
$res_paid = mysql_fetch_row($sql_paid);
$paidAmount = $res_paid[0];
$amount = $centFee ;
echo '<tr class="unread">
<td class="cell-title" >'.$pYear.'</td>
<td class="cell-title" >'.month_crt( substr($m , 5, 2)).' - '.$noCls.' </td>
<td class="cell-title" >
<div align="right"> '.numFormt($amount).'</div>
</td>
<td class="cell-title" ><div align="right">'.numFormt( $amount - $paidAmount ).'</div></td>
<td class="cell-title" >
<input type="checkbox" class="check" name="checkPay[]" value="'.numFormt( $amount - $paidAmount ).'" />
</td>
</tr>';
}
}
?>
在ajax成功回调中进行总结，例如:
$.ajax({
url: 'AJAX_Requst/getOtherPaymt.php',
type: 'POST',
data: {
'pYear': y,
'payType': pType,
},
success: function (data) {
$('#ajax_img_lod').hide();
$('#ajax_response').html(data);
// find(':checked') for checked ones
// even none seems checked regarding your servser side script
// so maybe use `.find('.check')` instead but that's not clear what you are expecting here???
var sum = $('#ajax_response').find(':checked').map(function () {
return +this.value
}).get().reduce(function (a, b) {
return a + b;
});
// do whatever you want with `sum`
console.log(sum);
}
});
或者你想调用它:
$(document).on('change', '.check', function () {
var sum = $('.check').filter(':checked').map(function () {
return +this.value
}).get().reduce(function (a, b) {
return a + b;
}/* to start with default value != 0 as '5' in your posted code*/, 5);
// do whatever you want with `sum`
console.log(sum);
}