如何减少变量的值?

时间:2018-12-20 10:48:07

标签: jquery

我有一个复选框和一个总值,我希望当未选中该复选框时总价值减少,而当再次选中该复选框时,它需要转到标准值。

当未选中此复选框时,我希望总值变为-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>

2 个答案:

答案 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>