表单计算器脚本基本价格未加载OnLoad

时间:2017-12-26 13:03:32

标签: javascript php jquery html forms

我的表单中有一个calulcator来计算我的下拉选项选项。

$(function() {
  $("select.calculate").on("change", calc);
  $("input[type=checkbox].calculate").on("click", calc);

  function calc() {
    var basePrice = 60;
    newPrice = basePrice;
    $("select.calculate option:selected, input[type=checkbox].calculate:checked").each(function() {
      newPrice += parseInt($(this).data('price'), 10);
    });

    newPrice = newPrice.toFixed(2);
    $("#item-price").html(newPrice);
    $("#item_price_val").val(newPrice);

  }
});

并在html中获取数字我将其作为:

<span id="item-price">0</span>

问题是,我的基本价格为60,但是当我进入页面时,它的零。只有当我做出选择时,价格才会上涨。如何在页面加载时从基础开始显示baseprice?

我需要它作为基本价格开始,因为这些选择不是必需的,所以如果我不选择那些,我将点击提交表格,它提交零美元而不是60美元。

1 个答案:

答案 0 :(得分:0)

 var basePrice = 60; 
 $(document).ready(function() {
 $("select.calculate").on("change", calc);
 $("input[type=checkbox].calculate").on("click", calc);
 $("#item-price").html(basePrice);
 $("#item_price_val").val(basePrice);
});
function calc() {
newPrice = basePrice;
$("select.calculate option:selected,input[type=checkbox].calculate:checked").each(function() {
  newPrice += parseInt($(this).data('price'), 10);
});
newPrice = newPrice.toFixed(2);
$("#item-price").html(newPrice);
$("#item_price_val").val(newPrice);
}

请使用代码的更新版本。