简体   繁体   English

Javascript 如果选中第一个和第二个复选框,则将值添加到变量

[英]Javascript if first and second checkbox checked add values to variable

I recently started learning Javascript and I tought that I'll write a script that acts like a price calculator.我最近开始学习 Javascript,我坚信我会写一个像价格计算器一样的脚本。 The original price is 200. If a customer chooses first checkbox option it adds 50 to price, if second then add 150 to price, if both then add 150 and 50 to price.原始价格为 200。如果客户选择第一个复选框选项,则价格会增加 50,如果第二个则价格会增加 150,如果两者都选择,则价格会增加 150 和 50。 So far I have both of them working separately but they wont add amount to price if both checkboxes are checked.到目前为止,我让他们两个单独工作,但如果两个复选框都被选中,他们不会增加价格。

How could I solve this problem?我该如何解决这个问题? Should I use anything else than if...else?我应该使用除 if...else 之外的任何东西吗?

Javascript 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 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>

If a customer chooses first checkbox option it adds 50 to price, if second then add 150 to price, if both then add 150 and 50 to price.如果客户选择第一个复选框选项,它会在价格上加 50,如果是第二个,则在价格上加 150,如果两者都选,则在价格上加 150 和 50。

Since you want both you should use two if conditions instead of else if , and even you don't have to specify the last else , if two checkboxes unchecked first and second price will takes initial value which is zero.因为你想要两个你应该使用两个 if 条件而不是else if ,甚至你不必指定最后一个else ,如果两个checkboxes未选中,第一个和第二个价格将采用初始值,即零。 So try this:所以试试这个:

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;

you are trying to add value to the price, but this script will only work for one checkbox since you are using if else, simple remove the else here and put the default price at top no need to put it in else.您正在尝试为价格增加价值,但此脚本仅适用于一个复选框,因为您使用的是 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;

}

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM