加载选中复选框并计算它们
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了加载选中复选框并计算它们相关的知识，希望对你有一定的参考价值。
我需要通过更改dataFim字段或点击radio button到达它来重新计算费率和服务。
请参阅下面的代码。在这个看到更好的所有领域的其他链接：https://jsfiddle.net/yormgb5j/1/
非常感谢你。
$(document).ready(function()
var data = new Date();
var dia = ("0" + data.getDate()).slice(-2);
var mes = ("0" + (data.getMonth() + 1)).slice(-2);
var ano4 = data.getFullYear();
var hora = ("0" + data.getHours()).slice(-2);
var min = ("0" + data.getMinutes()).slice(-2);
var str_data = dia + '/' + mes + '/' + ano4;
var str_hora = hora + ':' + min;
$("input[name=situacao]").on('change', function()
if ($(this).val() == "S")
$("#data_ini").attr("readonly", true);
$("#data_ini").attr("disabled", true);
$('#tab-kmUsado').hide();
else if ($(this).val() == "C")
$("#data_fim").attr("readonly", true);
$("#data_fim").attr("disabled", true);
$("#situacao_saida").attr("disabled", false);
$("#data_fim").val(str_data + " " + str_hora);
$("#tab_cliente").mouseover();
$('#tab-avisoKmUsado').hide();
$('#tab-kmUsado').show();
if ($("#selectPlano").val() == "KL")
$("#planoDia").html($("#dias").val());
$("#planoValor").html($("#valor_dia_kmlivre").val());
planoTotal = $("#dias").val() * $("#valor_dia_kmlivre").val();
$("#planoTotal").html(planoTotal.toFixed(2));
$(".planoTotal").val(planoTotal.toFixed(2));
if ($("#selectPlano").val() == "KMC")
$("#planoDia").html($("#dias").val());
$("#planoValor").html($("#valor_diaria_controlada").val());
planoTotal = $("#dias").val() * $("#valor_diaria_controlada").val();
$("#planoTotal").html(planoTotal.toFixed(2));
$(".planoTotal").val(planoTotal.toFixed(2));
if ($("#selectPlano").val() == "DI")
$("#planoDia").html($("#dias").val());
$("#planoValor").html($("#valor_diaria").val());
planoTotal = $("#dias").val() * $("#valor_diaria").val();
$("#planoTotal").html(planoTotal.toFixed(2));
$(".planoTotal").val(planoTotal.toFixed(2));
if ($("input[type=radio][name='seguroCarro']:checked").val() == "S")
$("#SegCarroS2").html($("#dias").val());
$("#SegCarroS3").html($("#val_seguro_carro").val());
seguroV = $("#dias").val() * $("#val_seguro_carro").val();
$("#SegCarroS4").html(seguroV.toFixed(2));
$(".SegCarroS4").val(seguroV.toFixed(2));
else
$("#SegCarroS2").html("0");
$("#SegCarroS3").html("0");
$("#SegCarroS4").html("0.00");
$(".SegCarroS4").val("0.00");
if ($("input[type=radio][name='seguroTerceiros']:checked").val() == "S")
$("#SegTerceirosT2").html($("#dias").val());
$("#SegTerceirosT3").html($("#val_seguro_terceiros").val());
seguroT = $("#dias").val() * $("#val_seguro_terceiros").val();
$("#SegTerceirosT4").html(seguroT.toFixed(2));
$(".SegTerceirosT4").val(seguroT.toFixed(2));
else
$("#SegTerceirosT2").html("0");
$("#SegTerceirosT3").html("0");
$("#SegTerceirosT4").html("0.00");
$(".SegTerceirosT4").val("0.00");
$(".recalcula").click();
else
).parent().find("input[name=situacao]:checked").change();
$("#tab_cliente").on('mouseover', function()
DAY = 1000 * 60 * 60 * 24;
var data_ini = $("#data_ini").val().toString().split('/');
data_ini2 = data_ini[1] + "/" + data_ini[0] + "/" + data_ini[2];
d1 = new Date(data_ini2);
var data_fim = $("#data_fim").val().toString().split('/');
data_fim2 = data_fim[1] + "/" + data_fim[0] + "/" + data_fim[2];
d2 = new Date(data_fim2);
$("#data_ini2").val($("#data_ini").val());
var diasLocacao = Math.round((d2.getTime() - d1.getTime()) / DAY);
$("#dias").val(diasLocacao);
).mouseover();
$(".c").on('change', function()
var values = $(this).val().split('|');
if ($(this).prop('checked'))
var quantity = $("table[id^=tabelaIE]").length;
$(this).data('qty', quantity);
var table = $("#tabelaIE").clone(true)
.attr('id', function()
return this.id + quantity;
)
.find(':text,:file')
.attr('id', function()
return this.id + quantity;
)
.val("")
.end();
//VALUE -> 1|Taxa de locação|ENC|15.00|FIX|POR|VLT|%
//$ID_ImpEnc|$nome|$tipo|$valor|$calculo|$valor_em|$aplicacao|$a
//APLICAÇÃO: [SEG] Sobre seguro, [KML] KmLivre, [DIA] Diária, [IE] Impostos/Encargos, [VLT] no valor total
//VALOR EM.: [MOT] Montante, [POR] Porcentagem.
//CALCULO..: [DIA]Por dia, [FIX]Fixo
//TIPO.....: [TXV]Taxa de Venda, [ENC]Encargos Extras
aplicacao = values[6];
valor_em = values[5];
calculo = values[4];
tipo = values[2];
if (valor_em == "MON" && calculo == "FIX")
table.find('.tNome').text(values[1]);
table.find('.tDias').text("1");
table.find('.tValor').text(values[3]);
tTotal = values[3] * 1;
table.find('.tTotal').text(tTotal.toFixed(2));
if (valor_em == "MON" && calculo == "DIA")
table.find('.tNome').text(values[1]);
table.find('.tDias').text($("#dias").val());
table.find('.tValor').text(values[3]);
tTotal = values[3] * $("#dias").val();
table.find('.tTotal').text(tTotal.toFixed(2));
if (valor_em == "POR" && calculo == "FIX")
if (aplicacao == "SEG")
$V = (50 + 30) / 100;
table.find('.tNome').text(values[1]);
table.find('.tDias').text("1");
table.find('.tValor').text(values[3]);
tTotal = values[3] * $V;
table.find('.tTotal').text(tTotal.toFixed(2));
if (aplicacao == "KML")
$V = values[3] / 100;
table.find('.tNome').text(values[1]);
table.find('.tDias').text("1");
table.find('.tValor').text(values[3]);
tTotal = values[3] - $V;
table.find('.tTotal').text(tTotal.toFixed(2));
if (aplicacao == "DIA")
$V = (values[3] * $("#dias").val()) / 100;
table.find('.tNome').text(values[1]);
table.find('.tDias').text($("#dias").val());
table.find('.tValor').text(values[3]);
tTotal = values[3] * $V;
table.find('.tTotal').text(tTotal.toFixed(2));
if (aplicacao == "VLT")
$V = $("#totalFatura").val() / 100;
table.find('.tNome').text(values[1]);
table.find('.tDias').text("1");
table.find('.tValor').text(values[3].substring(0, 2) + "%");
tTotal = values[3] * $V;
table.find('.tTotal').text(tTotal.toFixed(2));
values.forEach(function(valor, index)
table.find('[class="split' + (index + 1) + '"]').val(valor)
);
table.appendTo('#abc');
var oldVal = $('#somaTabelaIE').val();
$('#somaTabelaIE').val(eval(oldVal || 0) + eval(tTotal));
else
tTotal = values[3] * $("#dias").val();
var oldVal = $('#somaTabelaIE').val();
$('#somaTabelaIE').val(oldVal - eval(tTotal));
//remove a table que pertence ao checkbox
$("table#tabelaIE" + $(this).data('qty')).remove();
$(".recalcula").click();
).change();
);<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="tab_cliente"></div>
<input type="radio" class="situacao" name="situacao" id="situacao_reserva" value="R" disabled /> Reservation
<input type="radio" class="situacao" name="situacao" id="situacao_saida" value="S" checked />Output
<input type="radio" class="situacao" name="situacao" id="situacao_chegada" value="C" />Arrival
<p>
dataIni: <input name="dataIni" type="text" id="data_ini" value="01/04/2019 08:00" />
dataFim: <input name="dataFim" type="text" id="data_fim" value="03/04/2019 08:00" />
DAYS: <input type="text" id="dias" style="width: 50px">
</p>
<p>===============================================</p>
Invoice total: <input type="text" id="totalFatura" value="100.00" />
<p>===============================================</p>
<strong>OPTIONS:</strong>
<div id="D1">1.
<input name="opcoes[]" class="c Obrig" type="checkbox" checked value="1|Rental Rate|ENC|15.00|FIX|POR|VLT|%" alt="15.00" title="Rental Rate" /> <b> Rental Rate </b>
</div>
<div id="D2">2.
<input name="opcoes[]" class="c " type="checkbox" checked value="2|GPS|ENC|5.00|DIA|MON|DIA|" alt="5.00" title="GPS" /> GPS
</div>
<div id="D3">3.
<input name="opcoes[]" class="c " type="checkbox" value="3|Car wash|ENC|30.00|FIX|MON|VLT|" alt="30.00" title="Car wash" /> Car wash
</div>
<div id="D4">4.
<input name="opcoes[]" class="c " type="checkbox" checked value="4|Transfer|ENC|35.00|FIX|MON|VLT|" alt="35.00" title="Transfer" /> Transfer
</div>
<p>===============================================</p>
<table width="400" border="0">
<tr>
<td><b>RATES AND SERVICES</b></td>
</tr>
<tr>
<td>
<div id="abc">
<table id="tabelaIE" width='400' border='0'>
<tr>
<td class="tNome" width='190px'></td>
<td class="tDias" width='50px' align='center'></td>
<td class="tValor" width='60px' align='right'></td>
<td class="tTotal" width='100px' align='right'></td>
<td class="tValores">
<input type="hidden" class="split1" value="">
<input type="hidden" class="split2" value="">
<input type="hidden" class="split3" value="">
<input type="hidden" class="split4" value="">
<input type="hidden" class="split5" value="">
<input type="hidden" class="split6" value="">
<input type="hidden" class="split7" value="">
<input type="hidden" class="split8" value="">
</td>
</tr>
</table>
</div>
</td>
</tr>
</table>
<p>===============================================</p>
SUMMARY OF RATES AND SERVICES:
<input type="text" class="somaTabelaIE" id="somaTabelaIE" value="0">答案
更改：将事件添加到更改功能中并且跟踪事件是否为冒泡（通过客户端点击进行属性更改或在HTML标记中设置默认值）。
查询：取消选中逻辑减去总金额乘以天数而不是数量。
编辑：从html表中获取与复选框相关的总值（金额*数量）（即未选中的复选框）。
编辑2：更改方法以获得总金额并简化var Qty = $("#abc tr:contains('"+$(this).attr('title')+"') .tTotal").text();。已编辑的代码段正常工作。
编辑3：更改ID生成逻辑var quantity = eval($("table[id^=tabelaIE]:last").attr('id').replace("tabelaIE","0"))+1。
编辑4：更改新复选框输出和主动重新计算。
$(document).ready(function()
var data = new Date();
var dia = ("0" + data.getDate()).slice(-2);
var mes = ("0" + (data.getMonth() + 1)).slice(-2);
var ano4 = data.getFullYear();
var hora = ("0" + data.getHours()).slice(-2);
var min = ("0" + data.getMinutes()).slice(-2);
var str_data = dia + '/' + mes + '/' + ano4;
var str_hora = hora + ':' + min;
$("input[name=situacao]").on('change', function()
$('#somaTabelaIE').val("");
$('.tTotal:visible').each(function() $('#somaTabelaIE').val(Number($('#somaTabelaIE').val()) + Number(this.innerHTML)))
if ($(this).val() == "S")
$("#data_ini").attr("readonly", true);
$("#data_ini").attr("disabled", true);
$('#tab-kmUsado').hide();
else if ($(this).val() == "C")
$("#data_fim").attr("readonly", true);
$("#data_fim").attr("disabled", true);
$("#situacao_saida").attr("disabled", false);
$("#data_fim").val(str_data + " " + str_hora);
$("#tab_cliente").mouseover();
$('#tab-avisoKmUsado').hide();
$('#tab-kmUsado').show();
if ($("#selectPlano").val() == "KL")
$("#planoDia").html($("#dias").val());
$("#planoValor").html($("#valor_dia_kmlivre").val());
planoTotal = $("#dias").val() * $("#valor_dia_kmlivre").val();
$("#planoTotal").html(planoTotal.toFixed(2));
$(".planoTotal").val(planoTotal.toFixed(2));
if ($("#selectPlano").val() == "KMC")
$("#planoDia").html($("#dias").val());
$("#planoValor").html($("#valor_diaria_controlada").val());
planoTotal = $("#dias").val() * $("#valor_diaria_controlada").val();
$("#planoTotal").html(planoTotal.toFixed(2));
$(".planoTotal").val(planoTotal.toFixed(2));
if ($("#selectPlano").val() == "DI")
$("#planoDia").html($("#dias").val());
$("#planoValor").html($("#valor_diaria").val());
planoTotal = $("#dias").val() * $("#valor_diaria").val();
$("#planoTotal").html(planoTotal.toFixed(2));
$(".planoTotal").val(planoTotal.toFixed(2));
if ($("input[type=radio][name='seguroCarro']:checked").val() =="S")
$("#SegCarroS2").html($("#dias").val());
$("#SegCarroS3").html($("#val_seguro_carro").val());
seguroV = $("#dias").val() * $("#val_seguro_carro").val();
$("#SegCarroS4").html(seguroV.toFixed(2));
$(".SegCarroS4").val(seguroV.toFixed(2));
else
$("#SegCarroS2").html("0");
$("#SegCarroS3").html("0");
$("#SegCarroS4").html("0.00");
$(".SegCarroS4").val("0.00");
if ($("input[type=radio][name='seguroTerceiros']:checked").val() == "S")
$("#SegTerceirosT2").html($("#dias").val());
$("#SegTerceirosT3").html($("#val_seguro_terceiros").val());
seguroT = $("#dias").val() * $("#val_seguro_terceiros").val();
$("#SegTerceirosT4").html(seguroT.toFixed(2));
$(".SegTerceirosT4").val(seguroT.toFixed(2));
else
$("#SegTerceirosT2").html("0");
$("#SegTerceirosT3").html("0");
$("#SegTerceirosT4").html("0.00");
$(".SegTerceirosT4").val("0.00");
$(".recalcula").click();
else
).parent().find("input[name=situacao]:checked").change();
$("#tab_cliente").on('mouseover', function()
DAY = 1000 * 60 * 60 * 24;
var data_ini = $("#data_ini").val().toString().split('/');
data_ini2 = data_ini[1] + "/" + data_ini[0] + "/" + data_ini[2];
d1 = new Date(data_ini2);
var data_fim = $("#data_fim").val().toString().split('/');
data_fim2 = data_fim[1] + "/" + data_fim[0] + "/" + data_fim[2];
d2 = new Date(data_fim2);
$("#data_ini2").val($("#data_ini").val());
var diasLocacao = Math.round((d2.getTime() - d1.getTime()) / DAY);
$("#dias").val(diasLocacao);
).mouseover();
$(".c").on('change', function(e)
var values = $(this).val().split('|');
if ($(this).prop('checked'))
var quantity = eval($("table[id^=tabelaIE]:last").attr('id').replace("tabelaIE","0"))+1
$(this).data('qty', quantity);
var table = $("#tabelaIE").clone(true)
.attr('id', function()
return this.id + quantity;
)
.find(':text,:file')
.attr('id', function()
return this.id + quantity;
)
.val("")
.end();
//VALUE -> 1|Taxa de locação|ENC|15.00|FIX|POR|VLT|%
//$ID_ImpEnc|$nome|$tipo|$valor|$calculo|$valor_em|$aplicacao|$a
//APLICAÇÃO: [SEG] Sobre seguro, [KML] KmLivre, [DIA] Diária, [IE] Impostos/Encargos, [VLT] no valor total
//VALOR EM.: [MOT] Montante, [POR] Porcentagem.
//CALCULO..: [DIA]Por dia, [FIX]Fixo
//TIPO.....: [TXV]Taxa de Venda, [ENC]Encargos Extras
aplicacao = values[6];
valor_em = values[5];
calculo = values[4];
tipo = values[2];
if (valor_em == "MON" && calculo == "FIX")
table.find('.tNome').text(values[1]);
table.find('.tDias').text("1");
table.find('.tValor').text(values[3]);
tTotal = values[3] * 1;
table.find('.tTotal').text(tTotal.toFixed(2));
if (valor_em == "MON" && calculo == "DIA")
table.find('.tNome').text(values[1]);
table.find('.tDias').text($("#dias").val());
table.find('.tValor').text(values[3]);
tTotal = values[3] * $("#dias").val();
table.find('.tTotal').text(tTotal.toFixed(2));
if (valor_em == "POR" && calculo == "FIX")
if (aplicacao == "SEG")
$V = (50 + 30) / 100;
table.find('.tNome').text(values[1]);
table.find('.tDias').text("1");
table.find('.tValor').text(values[3]);
tTotal = values[3] * $V;
table.find('.tTotal').text(tTotal.toFixed(2));
if (aplicacao == "KML")
$V = values[3] / 100;
table.find('.tNome').text(values[1]);
table.find('.tDias').text("1");
table.find('.tValor').text(values[3]);
tTotal = values[以上是关于加载选中复选框并计算它们的主要内容，如果未能解决你的问题，请参考以下文章
如何启用在页面加载时选中的第一个复选框并仅显示数据目标 div 并隐藏其他复选框，并且一次仅选中一个复选框
如果在 Jquery 加载页面时在网格中禁用了所有复选框，则如果没有选中复选框并禁用按钮，则发出警报