我为汉堡、古柯和沙拉价格计算编写的代码不起作用

Code I have written for Burger, Coca and Salad price calculation doesn't work

我写了一个代码来计算汉堡、古柯和沙拉的价格。该代码应 return 基于数量或每个订购商品的数字(或因子)。我无法弄清楚代码的哪一部分不正确。当我更改项目数量时它不起作用。

var BurgNum = document.getElementById('Bnum').value,

  CocNum = document.getElementById('Cnum').value,

  SalNum = document.getElementById('Snum').value,

  Totalprice;

function getValue(n) {
  return n >= 2 && n < 5 ? n * 0.9 : n == 0 ? 0 : n == 1 ? 1 : n - 1;
}
var XBurgNum = getValue(BurgNum);
var XCocNum = getValue(CocNum);
var XSalNum = getValue(SalNum);

Totalprice = XBurgNum * 10 + XCocNum * 5 + XSalNum * 4
document.getElementById('price').value = Totalprice;
<html>
How many Burgers you want to order? <input type="number" id="Bnum" value="0" onchange="getValue(n);"></input>
<br> How many Cocas you want to order? <input type="number" id="Cnum" value="0" onchange="getValue(n);"></input>
<br> How many Salads you want to order? <input type="number" id="Snum" value="0" onchange="getValue(n);"></input>
<br> Price: <input type="number" id="price" readonly="readonly"></input>


</html>

那是因为您没有在 'onchange' 事件上调用正确的语句。您只需调用 getVAlue(n) 函数,该函数除了 return 之外什么都不做,您也将其用于

 var XBurgNum = getValue(BurgNum);
 var XCocNum = getValue(CocNum);
 var XSalNum = getValue(SalNum);

但是您没有更新更改事件的输出。

您正在调用一个函数 onchange,其中 returns 一个值,但没有对它执行任何操作。相反,您的 onchange 函数可以获得计算所需的值并相应地更新价格。

var burg = document.getElementById('Bnum'),
    coc = document.getElementById('Cnum'),
    sal = document.getElementById('Snum'),
    totalPrice = 0;

document.getElementById('price').value = totalPrice;

var updatePrice = function() {

    var burgNum = burg.value,
    cocNum = coc.value,
    salNum = sal.value;
    
    var xNums = [];
    
    [burgNum, cocNum, salNum].forEach(function(n, i) {
       xNums[i] = (n >= 2 && n < 5) ? n * 0.9 : n == 0 ? 0 : n == 1 ? 1 : n - 1;
    });
        
    totalPrice = xNums[0]*10 + xNums[1]*5 + xNums[2]*4;
        
    document.getElementById('price').value = totalPrice;
}
How many Burgers do you want to order? 
<input type="number" id="Bnum" value ="0" onchange="updatePrice()"/><br>

How many Cocas do you want to order?
<input type="number" id="Cnum" value ="0" onchange="updatePrice()"/><br>

How many Salads do you want to order? 
<input type="number" id="Snum" value="0" onchange="updatePrice()"/><br>

Price:
<input type="number" id="price" readonly="readonly"/>

试试这个,它会帮助你...

function getValue(val)
{
 var BurgNum = parseInt(document.getElementById('Bnum').value);
 var CocNum = parseInt(document.getElementById('Cnum').value);
 var SalNum = parseInt(document.getElementById('Snum').value);
 BurgNum = (BurgNum>=2 && BurgNum<5)?BurgNum*0.9:(BurgNum<2)?BurgNum:BurgNum-1;
 CocNum = (CocNum>=2 && CocNum<5)?CocNum*0.9:(CocNum<2)?CocNum:CocNum-1;
 SalNum = (SalNum>=2 && SalNum<5)?SalNum*0.9:(SalNum<2)?SalNum:SalNum-1;
 Totalprice = BurgNum*10 + CocNum*5 + SalNum*4;
 document.getElementById('price').value = (Totalprice>0 && Totalprice!=='NaN')?Totalprice:0;
}
<html>
 How many Burgers you want to order? <input type="number" id="Bnum" value ="0" onChange="getValue(this.value);"></input>
    <br>
 How many Cocas you want to order? <input type="number" id="Cnum" value ="0" onChange="getValue(this.value);"></input>
    <br>
 How many Salads you want to order? <input type="number" id="Snum" value="0" onChange="getValue(this.value);"></input>
 <br>
    Price: <input id="price" readonly="readonly"></input>
</html>

快乐编码...