需要有关以下 jQuery 代码片段的帮助;
我想做的是;
- 将金额添加到总计
- 当添加的金额复选框值加倍时
- 如果复选框状态发生变化,复选框更新值相应减去或添加到总计中
- 如果金额减去总计,复选框值将更改回原始值
- 如果复选框状态发生变化,复选框更新值相应减去或添加到总计中
下面是一段 jQuery 代码
$('#Addcar').on('click', function() {
if($(this).html()=='Add') {
$(this).html('Remove');
var tot = parseFloat($('#TotalAmount').val()) + parseFloat($('#QuoteAmount').val());
var totcan = parseFloat($('#Cancelation').val()) + 2;
$('#TotalPrice').val(tot);
$('#Cancelation').val(totcan);
} else {
$(this).html('Add');
var tot = parseFloat($('#TotalPrice').val()) - parseFloat($('#QuoteAmount').val());
var totcan = parseFloat($('#Cancelation').val()) - 2;
$('#TotalPrice').val(tot);
$('#Cancelation').val(totcan);
}
});
$('#Cancelation').change(function(){
if($(this).is(':checked')){
total = parseFloat($('#TotalPrice').val()) + Number($(this).val());
} else {
total = parseFloat($('#TotalPrice').val()) - Number($(this).val());
}
$('#TotalPrice').val(total);
});
这是更好解释的 fiddle ;
更新的 fiddle :
http://jsfiddle.net/55n8acus/7/
如果添加了 QuoteAmount 值并将复选框值从 Total 中删除,然后删除 QuoteAmount 值,结果值将是错误的,它应该是 52 而不是 48,原因是复选框不会更新,并且它仍然从 Total 中删除 4,而不是应该删除 2。
感谢大家的帮助
问候。
最佳答案
我从问题中可以理解的是,您想要从总价中减去该值,但当您点击时,您不小心使用了 #TotalValue 而不是 #TotalPrice在复选框上,将代码更改为此,它将按预期工作。
$('#Cancelation').change(function(){
if($(this).is(':checked')){
total = parseFloat($('#TotalPrice').val()) + Number($(this).val());
} else {
total = parseFloat($('#TotalPrice').val()) - Number($(this).val());
}
$('#TotalPrice').val(total);
});
这是更新后的 js fiddle :- jsfiddle.net/55n8acus/8
$('#Addcar').on('click', function() {
if($(this).html()=='Add') {
$(this).html('Remove');
var tot = parseFloat($('#TotalAmount').val()) + parseFloat($('#QuoteAmount').val());
var totcan = parseFloat($('#Cancelation').val()) + 2;
if(!$("#Cancelation").is(':checked')){
tot = tot -4;
}
$('#TotalPrice').val(tot);
$('#Cancelation').val(totcan);
$('#Cancel').html(totcan);
} else {
$(this).html('Add');
var tot = parseFloat($('#TotalPrice').val()) - parseFloat($('#QuoteAmount').val());
if(!$("#Cancelation").is(':checked')){
tot +=2;
}
var totcan = parseFloat($('#Cancelation').val()) - 2;
$('#TotalPrice').val(tot);
$('#Cancelation').val(totcan);
$('#Cancel').html(totcan);
}
});
$('#Cancelation').change(function(){
if($(this).is(':checked')){
total = parseFloat($('#TotalPrice').val()) + Number($(this).val());
} else {
total = parseFloat($('#TotalPrice').val()) - Number($(this).val());
}
$('#TotalPrice').val(total);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a href="javascript:;" id="Addcar">Add</a><br>
<input type="text" id="QuoteAmount" value="50" />
<input type="text" name="TotalAmount" id="TotalAmount" value="52" /><br>
<input type="text" name="TotalPrice" id="TotalPrice" value="0" /><br>
<input type="checkbox" id="Cancelation" value="2" checked> <span id="Cancel">2</span>
关于javascript - 使用 jQuery 添加和减去值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30676349/