javascript - 选择小费时如何更新总金额

Question

我正在创建一个简单的送餐服务。我想弄清楚如何在选择小费时更新总金额

    if(choiceRegular.checked == true) {
        var totalPrice = choiceRegular.value;
    }else if (choicePremium.checked == true) {
        totalPrice = choicePremium.value;
    }else if(choiceRoyal.checked == true) {
        totalPrice = choiceRoyal.value;
    }else {
        totalPrice = 0;
    }


    if(tenTip.checked == true) {
        var tipPrice = tenTip.value * totalPriceNum
    } else if(fiveTip.checked == true) {
        tipPrice = fiveTip.value
    } else if(twentyTip.checked == true) {
        tipPrice = twentyTip.value
    } else {
        tipPrice = 0
    }



    totalPriceNum = Number(totalPrice);
    tipPriceNum = Number(tipPrice);



    document.getElementById('total-amount').innerHTML = '$'+totalPriceNum;

Answer 1

在不了解完整范围的情况下，我认为在您的情况下，totalPriceNum = Number(totalPrice) + Number(tipPrice); 将是总计。

如果 totalPrice 和 tipPrice 的值已经声明，您可能希望将其设为 JS 中的函数

作为函数，例如:

    function refreshTotal(){
      var totalNumBeforeTip = Number(totalPrice);

      if(tenTip.checked == true) {
        var tipPrice = tenTip.value * totalPriceNum
      } else if(fiveTip.checked == true) {
        var tipPrice = fiveTip.value
      } else if(twentyTip.checked == true) {
        var tipPrice = twentyTip.value
      } else {
        var tipPrice = 0;
      }
      var tipPriceNum = Number(tipPrice);
      var combinedTotal = totalNumBeforeTip + tipPrice;
      var priceResultElement = document.getElementById('total-amount');
      priceResultElement.innerHTML = '$'+combinedTotal;
    }

在 html 中是这样的:

    add $5 tip <input type="checkbox" id="tip-5" value="5.00" onChange="refreshTotal()">