如何使复选框数据在我的计算脚本中添加总数的 25%

Question

我有一个内置于Jquery中的计算器它基本上将数据价格="加在一起，但是我需要在勾选的每个复选框的总金额上添加 25%。

现在它只是将复选框值添加到计算中，我需要它将总数添加到总数的 25%。

因此，如果当前的总额为 400 英镑，然后勾选了一个复选框，计算器应该取 400 英镑并加上 25%，使其达到 450 英镑

$(function(){
    $("select.valuvehiclevalue1").on("change", calc);
  $("select.valuvehiclevalue2").on("change", calc);
    $("select.valuvehiclevalue3").on("change", calc);
      $("select.valuvehiclevalue4").on("change", calc);
        $("select.valuvehiclevalue5").on("change", calc);
  $("input[type=checkbox].calculate").on("click", calc);
  function calc() {
   var basePrice = 0;
    newPrice = basePrice;
    $("select.valuvehiclevalue1 option:selected, select.valuvehiclevalue2 option:selected, select.valuvehiclevalue3 option:selected, select.valuvehiclevalue4 option:selected, select.valuvehiclevalue5 option:selected, input[type=checkbox].calculate:checked").each(function () {
      newPrice += parseInt($(this).data('price'), 10);
    });
    newPrice = newPrice.toFixed(2);
    $("#item-price").html(newPrice);
  }
});

一点点的网页

  <label>How long do you want the cover?</label>
<select class="valuvehiclevalue5" name="howlongcover"  id="valuvehiclevalue4">
 <option data-price="0">Pick one!</option>
 <option id="howlongcover1" value="valuhowlongcover" data-price="122" >24 Months e</option>
<option id="howlongcover2" value="valuhowlongcover"data-price="134" >36 Months</option>
<option id="howlongcover3" value="valuhowlongcover"data-price="155" >48 Months</option>
<option id="howlongcover4" value="valuhowlongcover"data-price="354" >60 Months</option>
 </select>

<label><input class="calculate" id="checkboxes" type="checkbox" name="checks" data-price="25"><span></span> It's classed as a 4x4</label><BR>
  <label><input class="calculate" id="checkboxes1"  type="checkbox" name="checks" data-price="25"><span></span> The engine is more than 2.5L</label><BR>
    <label><class="calculate" id="checkboxes2" type="checkbox" name="checks" data-price="25"><span></span> It's a commercial use</label><BR>

£<span id="item-price">0.00</span>

我真的不确定这个，任何帮助将不胜感激

谢谢

Answer 1

可以这样做。 可以看到它在这里工作。

$(function(){
    $("select.valuvehiclevalue1").on("change", calc);
    $("select.valuvehiclevalue2").on("change", calc);
    $("select.valuvehiclevalue3").on("change", calc);
    $("select.valuvehiclevalue4").on("change", calc);
    $("select.valuvehiclevalue5").on("change", calc);
    $("input[type=checkbox].calculate").on("click", calc);
  function calc() {
   var basePrice = 0;
    newPrice = basePrice;
    $("select.valuvehiclevalue1 option:selected, select.valuvehiclevalue2 option:selected, select.valuvehiclevalue3 option:selected, select.valuvehiclevalue4 option:selected, select.valuvehiclevalue5 option:selected").each(function () {
      newPrice += parseInt($(this).data('price'), 10);
    });
    $("input[type=checkbox].calculate:checked").each(function () {
      var price = $("#item-price").html();
      newPrice += price * .25;
    });
    newPrice = newPrice.toFixed(2);
    $("#item-price").html(newPrice);
  }
});

Answer 2

你需要单独遍历checkbox es

function calc() {
   var basePrice = 0;
    newPrice = basePrice;
    $("select.valuvehiclevalue1 option:selected, select.valuvehiclevalue2 option:selected, select.valuvehiclevalue3 option:selected, select.valuvehiclevalue4 option:selected, select.valuvehiclevalue5 option:selected").each(function () {
      newPrice += parseInt($(this).data('price'), 10);
    });
    var percentage = 0;
    $("input[type=checkbox].calculate:checked").each(function(){
        percentage += parseInt($(this).data('price'), 10);
    });
    newPrice = newPrice + (newPrice * percentage / 100 );
    newPrice = newPrice.toFixed(2);
    $("#item-price").html(newPrice);
  }