我有一个复选框和一个总值,我希望当未选中该复选框时总价值减少,而当再次选中该复选框时,它需要转到标准值。
当未选中此复选框时,我希望总值变为-300,再次选中该值时,它将删除-300,因此其恢复正常。但是我的代码不起作用。它只是无能为力。
$('input').on('change', function() {
if ($('#CalculatorPlacing').prop('checked') == false) {
begin = begin - 300;
}
});
var begin = 720;
$(document).ready(function() {
$("#yett").val('Total €' + begin.toFixed(2).replace(/\./g, ','));
$("#FenceCorners").on("change", function() {
var prev = $("#yett").val();
prev = prev.split('€')[1];
var total = ($(this).find(":selected").data("price") * 100) / 100;
total = parseInt(begin) + parseInt(total); //use begin
// totals = parseInt(total);
$("#yett").val('Total €' + total.toFixed(2).replace(/\./g, ','));
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="SummaryRow">
<h1><input type="yeets" name="_mdjm_event_cost" id="yett" class="mdjm-input-currency required" readonly="readonly" value="" placeholder="Totaal €0.00" style="
height: 100px;
width: 275px;
margin-top: -40px;
color: black;
font-weight: bold;" />
</h1>
</div>
<div class="switch">
<input type="checkbox" name="iCalculatorPlacing" id="CalculatorPlacing" class="cmn-toggle cmn-toggle-round AutosubmitCalculator" value="1" tabindex="5">
<label for="CalculatorPlacing" data-on="JA" data-off="NEE"></label>
</div>
答案 0 :(得分:1)
几个问题
请稍等一下,因为您没有发布完整的代码,所以我不得不摆弄
var begin = 720;
function toEur(num) {
return 'Total €' + num.toFixed(2).replace(/\./g, ',')
}
function toNum(str) {
return +(str.split("€")[1].replace(",", "."))
}
$(function() {
$("#yett").val(toEur(begin));
$("#FenceCorners").on("change", function() {
var prev = $("#yett").val();
prev = prev.split('€')[1]; // ??? used?
var total = ($(this).find(":selected").data("price") * 100) / 100;
total = parseInt(begin) + parseInt(total); //use begin
// totals = parseInt(total);
$("#yett").val(toEuro(total));
});
$('#CalculatorPlacing').on('change', function() {
$("#FenceCorners").change();
$("#yett").val(
toEur(
toNum(
$("#yett").val()
) + (this.checked ? -300 : 0)
)
)
})
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="SummaryRow">
<h1><input type="yeets" name="_mdjm_event_cost" id="yett" class="mdjm-input-currency required" readonly="readonly" value="" placeholder="Totaal €0.00" style="
height: 100px;
width: 275px;
margin-top: -40px;
color: black;
font-weight: bold;" />
</h1>
</div>
<div class="switch">
<input type="checkbox" name="iCalculatorPlacing" id="CalculatorPlacing" class="cmn-toggle cmn-toggle-round AutosubmitCalculator" value="1" tabindex="5">
<label for="CalculatorPlacing" data-on="JA" data-off="NEE"></label>
</div>
答案 1 :(得分:1)
您需要减少代码中不必要的行
工作片段:-
$(document).ready(function() {
var begin = 720;
$("#yett").val('Total €' + begin.toFixed(2).replace(/\./g, ','));
$("#CalculatorPlacing").on("change", function() {
var prev = $("#yett").val().split('€')[1];
if ($(this).prop('checked') == false) {
total = begin - 300;
$("#yett").val('Total €' + total.toFixed(2).replace(/\./g, ','));
}else{
$("#yett").val('Total €' + begin.toFixed(2).replace(/\./g, ','));
}
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="SummaryRow">
<h1><input type="yeets" name="_mdjm_event_cost" id="yett" class="mdjm-input-currency required" readonly="readonly" value="" placeholder="Totaal €0.00" style="
height: 100px;
width: 275px;
margin-top: -40px;
color: black;
font-weight: bold;" />
</h1>
</div>
<div class="switch">
<input type="checkbox" name="iCalculatorPlacing" id="CalculatorPlacing" class="cmn-toggle cmn-toggle-round AutosubmitCalculator" value="1" tabindex="5">
<label for="CalculatorPlacing" data-on="JA" data-off="NEE"></label>
</div>