<section id="extensions" class=" extensions pad-80">
<div class="myvolunteer-header">
<div class="container">
<div class="row">
<div class="col-md-12 col-sm-12 col-xs-12">
<h2 class="lg-title text-center"><span>Schemes for Mentally Retarded Children<br /> Mentally Challanged by God</span></h2>
</div> <!--/.col-->
<div class="col-md-6 col-sm-12 col-xs-12 col-md-offset-3">
<p class="lg-text text-center"></p>
</div> <!--/.col-->
</div>
</div>
</div>
<div class="container tr-donate">
<div class="row">
<div class="col-md-12 col-sm-12 col-xs-12">
<table align="center">
<tr>
<th>No.</th>
<th>Amount</th>
<th>Information of Scheme</th>
</tr>
<tr>
<td style="padding: 10px"></td>
</tr>
<tr class="someSwitchOptionWarning1">
<td>1.</td>
<td>Rs.25,000.00</td>
<td>Scheme of adoption of mentally retarded child permanently</td>
<td>
<div class="material-switch ">
<input id="someSwitchOptionWarning1" onclick="change(this.id)" name="someSwitchOption001" type="checkbox" value="25000" />
<label for="someSwitchOptionWarning1" class="label-warning"></label>
</div>
</td>
</tr>
<tr class="someSwitchOptionWarning2">
<td>2.</td>
<td>Rs.25,000.00</td>
<td>Scheme of sweet diet one time/ pernanent date in a year</td>
<td>
<div class="material-switch ">
<input id="someSwitchOptionWarning2" onclick="change(this.id)" name="someSwitchOption001" type="checkbox" value="25000" />
<label for="someSwitchOptionWarning2" class="label-warning"></label>
</div>
</td>
</tr>
<tr class="someSwitchOptionWarning3">
<td>3.</td>
<td>Rs.15,000.00</td>
<td>Scheme of simple diet one time of time of permanent date in a year</td>
<td>
<div class="material-switch ">
<input id="someSwitchOptionWarning3" onclick="change(this.id)" name="someSwitchOption001" type="checkbox" value="15000"/>
<label for="someSwitchOptionWarning3" class="label-warning"></label>
</div>
</td>
</tr>
<tr class="someSwitchOptionWarning4">
<td>4.</td>
<td>Rs.4,000.00</td>
<td>Sheme of one time sweet diet</td>
<td>
<div class="material-switch ">
<input id="someSwitchOptionWarning4" onclick="change(this.id)" name="someSwitchOption001" type="checkbox" value="4000"/>
<label for="someSwitchOptionWarning4" class="label-warning"></label>
</div>
</td>
</tr>
<tr class="someSwitchOptionWarning5">
<td>5.</td>
<td>Rs.2,000.00</td>
<td>Scheme of one time simple diet</td>
<td>
<div class="material-switch ">
<input id="someSwitchOptionWarning5" onclick="change(this.id)" name="someSwitchOption001" type="checkbox" value="2000"/>
<label for="someSwitchOptionWarning5" class="label-warning"></label>
</div>
</td>
</tr>
<tr class="someSwitchOptionWarning6">
<td>6.</td>
<td>Rs.1,000.00</td>
<td>Sheme of one time breakfast</td>
<td>
<div class="material-switch ">
<input id="someSwitchOptionWarning6" onclick="change(this.id)" name="someSwitchOption001" type="checkbox" value="1000"/>
<label for="someSwitchOptionWarning6" class="label-warning"></label>
</div>
</td>
</tr>
<tr class="someSwitchOptionWarning7">
<td>7.</td>
<td>Rs.1,250.00</td>
<td>Scheme of one time milk</td>
<td>
<div class="material-switch ">
<input id="someSwitchOptionWarning7" onclick="change(this.id)" name="someSwitchOption001" type="checkbox" value="1250"/>
<label for="someSwitchOptionWarning7" class="label-warning"></label>
</div>
</td>
</tr>
<tr class="someSwitchOptionWarning8">
<td>8.</td>
<td>Rs.50,000.00</td>
<td>Scheme of school uniform of 100 children</td>
<td>
<div class="material-switch ">
<input id="someSwitchOptionWarning8" onclick="change(this.id)" name="someSwitchOption001" type="checkbox" value="50000"/>
<label for="someSwitchOptionWarning8" class="label-warning"></label>
</div>
</td>
</tr>
<tr class="someSwitchOptionWarning9">
<td>9.</td>
<td>Rs.1,00,000.00</td>
<td>Scheme of one month kiranas</td>
<td>
<div class="material-switch ">
<input id="someSwitchOptionWarning9" onclick="change(this.id)" name="someSwitchOption001" type="checkbox" value="100000"/>
<label for="someSwitchOptionWarning9" class="label-warning"></label>
</div>
</td>
</tr>
<tr class="someSwitchOptionWarning10">
<td>10.</td>
<td>Rs.11,000.00</td>
<td>The name of donar shall be included in the General list of donors for construction of bhavan of the institution</td>
<td>
<div class="material-switch ">
<input id="someSwitchOptionWarning10" onclick="change(this.id)" name="someSwitchOption001" type="checkbox" value="11000"/>
<label for="someSwitchOptionWarning10" class="label-warning"></label>
</div>
</td>
</tr>
<tr class="someSwitchOptionWarning11">
<td>11.</td>
<td>Other</td>
<td class="btn-parent">
<input type="text" id="btn_amount" name="amount" />
<span class="bar-amount"></span>
<label for="btn-amount" id="lbl_amount">Enter Amount</label>
</td>
<td>
<div class="material-switch ">
<input id="someSwitchOptionWarning11" onclick="change(this.id)" name="someSwitchOption001" type="checkbox" value="0"/>
<label for="someSwitchOptionWarning11" class="label-warning"></label>
</div>
</td>
</tr>
<tr>
<td style="padding: 10px"></td>
</tr>
</table>
<label for="amount">Total Amount</label>
<input type="text" name="amount" id="donationAmount" style="display: block;">
</div> <!--/.col-->
</div> <!--/.row-->
</div> <!--/.container-->
如果选中复选框，我如何计算复选框值和文本框值的总和，当取消选中复选框时，如何减去复选框或文本框的值。
我尝试了jquery但它只计算复选框的值但是如何计算textbox的值
最后一个名为total的文本框，其中显示复选框和文本框的总数，请帮助我
答案 0 :(得分：3)
试试这个，它应该按你的意愿去做。
$("[class^=someSwitchOptionWarning] input[type=checkbox], [class^=someSwitchOptionWarning] input[name=amount]").on("change keyup",function(){
var sum = 0;
$("[class^=someSwitchOptionWarning] input[type=checkbox]:checked").map(function() {
sum += parseInt($(this).val())
}).get();
sum += parseInt($("[class^=someSwitchOptionWarning] input[name=amount]").val().length == 0 ? 0 : $("[class^=someSwitchOptionWarning] input[name=amount]").val())
$("#donationAmount").val(sum)
})
<强>演示
function change(obj){
}
$("[class^=someSwitchOptionWarning] input[type=checkbox], [class^=someSwitchOptionWarning] input[name=amount]").on("change keyup",function(){
var sum = 0;
$("[class^=someSwitchOptionWarning] input[type=checkbox]:checked").map(function() {
sum += parseInt($(this).val())
}).get();
sum += parseInt($("[class^=someSwitchOptionWarning] input[name=amount]").val().length == 0 ? 0 : $("[class^=someSwitchOptionWarning] input[name=amount]").val())
$("#donationAmount").val(sum)
})<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<section id="extensions" class=" extensions pad-80">
<div class="myvolunteer-header">
<div class="container">
<div class="row">
<div class="col-md-12 col-sm-12 col-xs-12">
<h2 class="lg-title text-center"><span>Schemes for Mentally Retarded Children<br /> Mentally Challanged by God</span></h2>
</div>
<!--/.col-->
<div class="col-md-6 col-sm-12 col-xs-12 col-md-offset-3">
<p class="lg-text text-center"></p>
</div>
<!--/.col-->
</div>
</div>
</div>
<div class="container tr-donate">
<div class="row">
<div class="col-md-12 col-sm-12 col-xs-12">
<table align="center">
<tr>
<th>No.</th>
<th>Amount</th>
<th>Information of Scheme</th>
</tr>
<tr>
<td style="padding: 10px"></td>
</tr>
<tr class="someSwitchOptionWarning1">
<td>1.</td>
<td>Rs.25,000.00</td>
<td>Scheme of adoption of mentally retarded child permanently</td>
<td>
<div class="material-switch ">
<input id="someSwitchOptionWarning1" onclick="change(this.id)" name="someSwitchOption001" type="checkbox" value="25000" />
<label for="someSwitchOptionWarning1" class="label-warning"></label>
</div>
</td>
</tr>
<tr class="someSwitchOptionWarning2">
<td>2.</td>
<td>Rs.25,000.00</td>
<td>Scheme of sweet diet one time/ pernanent date in a year</td>
<td>
<div class="material-switch ">
<input id="someSwitchOptionWarning2" onclick="change(this.id)" name="someSwitchOption001" type="checkbox" value="25000" />
<label for="someSwitchOptionWarning2" class="label-warning"></label>
</div>
</td>
</tr>
<tr class="someSwitchOptionWarning3">
<td>3.</td>
<td>Rs.15,000.00</td>
<td>Scheme of simple diet one time of time of permanent date in a year</td>
<td>
<div class="material-switch ">
<input id="someSwitchOptionWarning3" onclick="change(this.id)" name="someSwitchOption001" type="checkbox" value="15000" />
<label for="someSwitchOptionWarning3" class="label-warning"></label>
</div>
</td>
</tr>
<tr class="someSwitchOptionWarning4">
<td>4.</td>
<td>Rs.4,000.00</td>
<td>Sheme of one time sweet diet</td>
<td>
<div class="material-switch ">
<input id="someSwitchOptionWarning4" onclick="change(this.id)" name="someSwitchOption001" type="checkbox" value="4000" />
<label for="someSwitchOptionWarning4" class="label-warning"></label>
</div>
</td>
</tr>
<tr class="someSwitchOptionWarning5">
<td>5.</td>
<td>Rs.2,000.00</td>
<td>Scheme of one time simple diet</td>
<td>
<div class="material-switch ">
<input id="someSwitchOptionWarning5" onclick="change(this.id)" name="someSwitchOption001" type="checkbox" value="2000" />
<label for="someSwitchOptionWarning5" class="label-warning"></label>
</div>
</td>
</tr>
<tr class="someSwitchOptionWarning6">
<td>6.</td>
<td>Rs.1,000.00</td>
<td>Sheme of one time breakfast</td>
<td>
<div class="material-switch ">
<input id="someSwitchOptionWarning6" onclick="change(this.id)" name="someSwitchOption001" type="checkbox" value="1000" />
<label for="someSwitchOptionWarning6" class="label-warning"></label>
</div>
</td>
</tr>
<tr class="someSwitchOptionWarning7">
<td>7.</td>
<td>Rs.1,250.00</td>
<td>Scheme of one time milk</td>
<td>
<div class="material-switch ">
<input id="someSwitchOptionWarning7" onclick="change(this.id)" name="someSwitchOption001" type="checkbox" value="1250" />
<label for="someSwitchOptionWarning7" class="label-warning"></label>
</div>
</td>
</tr>
<tr class="someSwitchOptionWarning8">
<td>8.</td>
<td>Rs.50,000.00</td>
<td>Scheme of school uniform of 100 children</td>
<td>
<div class="material-switch ">
<input id="someSwitchOptionWarning8" onclick="change(this.id)" name="someSwitchOption001" type="checkbox" value="50000" />
<label for="someSwitchOptionWarning8" class="label-warning"></label>
</div>
</td>
</tr>
<tr class="someSwitchOptionWarning9">
<td>9.</td>
<td>Rs.1,00,000.00</td>
<td>Scheme of one month kiranas</td>
<td>
<div class="material-switch ">
<input id="someSwitchOptionWarning9" onclick="change(this.id)" name="someSwitchOption001" type="checkbox" value="100000" />
<label for="someSwitchOptionWarning9" class="label-warning"></label>
</div>
</td>
</tr>
<tr class="someSwitchOptionWarning10">
<td>10.</td>
<td>Rs.11,000.00</td>
<td>The name of donar shall be included in the General list of donors for construction of bhavan of the institution</td>
<td>
<div class="material-switch ">
<input id="someSwitchOptionWarning10" onclick="change(this.id)" name="someSwitchOption001" type="checkbox" value="11000" />
<label for="someSwitchOptionWarning10" class="label-warning"></label>
</div>
</td>
</tr>
<tr class="someSwitchOptionWarning11">
<td>11.</td>
<td>Other</td>
<td class="btn-parent">
<input type="text" id="btn_amount" name="amount" />
<span class="bar-amount"></span>
<label for="btn-amount" id="lbl_amount">Enter Amount</label>
</td>
<td>
<div class="material-switch ">
<input id="someSwitchOptionWarning11" onclick="change(this.id)" name="someSwitchOption001" type="checkbox" value="0" />
<label for="someSwitchOptionWarning11" class="label-warning"></label>
</div>
</td>
</tr>
<tr>
<td style="padding: 10px"></td>
</tr>
</table>
<label for="amount">Total Amount</label>
<input type="text" name="amount" id="donationAmount" style="display: block;">
</div>
<!--/.col-->
</div>
<!--/.row-->
</div>
<!--/.container-->
答案 1 :(得分：1)
为您所需的输入提供确切的类别名称，例如价格，然后
$(document).ready(function(){
$(".price").change(function(){
var total=0;
$(".price").each(function(){
if($(this).is(":checked")) {total=total+$(this).val()}
})
})
//finally put the total in desired field
$("input[name=amount]").val(total)
})
答案 2 :(得分：1)
试试这个。另请注意，您应该只允许在文本框中输入数字，如果文本框为空，则应在其中显示0作为值。
$(document).ready(function () {
var checkboxtotal = 0;
var textboxValue = 0
change = function(id){
if($('#'+id+':checked').length == 1)
checkboxtotal = checkboxtotal + parseInt($('#'+id).val()) + textboxValue;
else
checkboxtotal = checkboxtotal - parseInt($('#'+id).val()) + textboxValue;
$('#donationAmount').val(checkboxtotal);
}
$('#btn_amount').on('input', function() {
textboxValue = $('#btn_amount').val();
$('#donationAmount').val(checkboxtotal + parseInt(textboxValue));
});
});