首页 > 解决方案 > 我的代码在第 66 行被破坏,由于某种原因,我不断收到意外的令牌

问题描述

// add 5 other toppings here
if (document.getElementById("pepperoni").checked) {total = total + 2.25;}

if (document.getElementById("sausage").checked) {total = total + 2.25;}

if (document.getElementById("supreme").checked) {total = total + 2.75;}

if (document.getElementById("chicken").checked) {total = total + 2.25;}

if (document.getElementById("hawaiian").checked) {total = total + 2.50;   }

line 66 // add 11.25% sales tax to the cost of the food (but not delivery)
total = {total + (total * (11.25 / 100));}

// add the delivery charge
total = {total + 3.00;}

// write the result to output
document.getElementById("output").innerHTML = {"Your total is: $" + total.toFixed(2);}


input type="checkbox" id="extracheese" value="2.00">
Extra Cheese (add $2.00)
<br>
<input type="checkbox" id="pepperoni" value="2.25">
Pepperoni (add $2.25)
<br>
<input type="checkbox" id="sausage" value="2.25">
Sausage (add $2.25)
<br>
<input type="checkbox" id="supreme" value="2.75">
Supreme (add $2.75)
<br>
<input type="checkbox" id="chicken" value="2.25">
Chicken (add $2.25)
<br>
<input type="checkbox" id="hawaiian" value="2.50">
Hawaiian (add $2.50)
<br>

</p>

<p id="pickupOrDelivery">

<input type="radio" name="pickup" id="pickup" value="pickup"> 
// pickup

if (document.getElementbyId("pickup").selected) {}

// delivery

else if (document.getElementbyId("delivery").selected) {total = total + 3.00}

// neither selected 
else {alert("Please select pickup or delivery.");}

标签: javascripthtmlformsfunction

解决方案


更改您的代码如下:

// add 5 other toppings here
if (document.getElementById("pepperoni").checked) total = total + 2.25;
if (document.getElementById("sausage").checked) total = total + 2.25;
if (document.getElementById("supreme").checked) total = total + 2.75;
if (document.getElementById("chicken").checked) total = total + 2.25;
if (document.getElementById("hawaiian").checked) {total = total + 2.50;   }

line 66 // add 11.25% sales tax to the cost of the food (but not delivery)
total = total + (total * (11.25 / 100));

// add the delivery charge
total = total + 3.00;

// write the result to output
document.getElementById("output").innerHTML = `Your total is: 
$${total.toFixed(2)`;

不要将所有内容都包装在 {}

还要考虑这个:

const calcToppings = () => Array.from(document.querySelectorAll('.topping'))
                                .filter(el => el.checked)
                                .map(({ value }) => parseFloat(value))
                                .reduce((a,v) => a+v,0);
                                
                                
document.addEventListener('click', ({ target }) => {
  if(target.matches('button')) {
    document.querySelector('.result').innerText = calcToppings();
  }
});
                                
                             
<input type="checkbox" id="extracheese" class="topping" value="2.00"> Extra Cheese (add $2.00)
<br>
<input type="checkbox" id="pepperoni" class="topping" value="2.25"> Pepperoni (add $2.25)
<br>
<input type="checkbox" id="sausage" class="topping" value="2.25"> Sausage (add $2.25)
<br>
<input type="checkbox" id="supreme" class="topping" value="2.75"> Supreme (add $2.75)
<br>
<input type="checkbox" id="chicken" class="topping" value="2.25"> Chicken (add $2.25)
<br>
<input type="checkbox" id="hawaiian" class="topping" value="2.50"> Hawaiian (add $2.50)
<br>

<button>Click Me</button>
<div class="result"></div>

这允许使用非常容易地添加/删除顶部选项,而无需调整我们的脚本。


推荐阅读