Javascript 如果選中第一個和第二個復選框，則將值添加到變量

Question

我最近開始學習 Javascript，我堅信我會寫一個像價格計算器一樣的腳本。 原始價格為 200。如果客戶選擇第一個復選框選項，則價格會增加 50，如果第二個則價格會增加 150，如果兩者都選擇，則價格會增加 150 和 50。 到目前為止，我讓他們兩個單獨工作，但如果兩個復選框都被選中，他們不會增加價格。

我該如何解決這個問題？ 我應該使用除 if...else 之外的任何東西嗎？

Javascript

function myFunction() {

var price;
var originalprice = 200;
var firstprice = 0;
var secondprice = 0;

var checkBox = document.getElementById('myCheck');
var checkBox2 = document.getElementById('myCheck2');

if (checkBox.checked == true){
    
    firstprice = 50;
    
    
}else if(checkBox2.checked == true){
    
    secondprice = 150;
    
}

else {
    
    price = originalprice;
}

var price = firstprice + secondprice + originalprice;

var el = document.getElementById('showprice');
el.textContent=price;



}

HTML

<h1>Check one or both of the checkboxes</h1>

Yes: <input type="checkbox" id="myCheck" onclick="myFunction()">
No: <input type="checkbox">

Yes: <input type="checkbox" id="myCheck2" onclick="myFunction()">
No: <input type="checkbox">



<div id="showprice">



</div>

Answer 1

如果客戶選擇第一個復選框選項，它會在價格上加 50，如果是第二個，則在價格上加 150，如果兩者都選，則在價格上加 150 和 50。

因為你想要兩個你應該使用兩個 if 條件而不是else if ，甚至你不必指定最后一個else ，如果兩個checkboxes未選中，第一個和第二個價格將采用初始值，即零。 所以試試這個：

var originalprice = 200;
var firstprice = 0;
var secondprice = 0;
if (checkBox.checked == true){
    firstprice = 50;
}
if(checkBox2.checked == true){
    secondprice = 150;
}
var price = firstprice + secondprice + originalprice;

Answer 2

您正在嘗試為價格增加價值，但此腳本僅適用於一個復選框，因為您使用的是 if else，只需在此處刪除 else 並將默認價格放在頂部，無需將其放入 else。

function myFunction() {


var originalprice = 200;
var firstprice = 0;
var secondprice = 0;
var price = originalprice;

var checkBox = document.getElementById('myCheck');
var checkBox2 = document.getElementById('myCheck2');

  if (checkBox.checked == true){
    firstprice = 50;
  }
  if(checkBox2.checked == true){
    secondprice = 150;
  }

  var price = firstprice + secondprice + originalprice;

  var el = document.getElementById('showprice');
  el.textContent=price;

}