这是我在网页课上刚刚得到的任务,老实说我没有一个讲师清楚地解释过for循环如何工作。基本上,我需要一个变量来存储所有输入,以及一个for循环来遍历每个输入并将其添加到总和中,而不是定义一堆不同的变量并为每个变量编写一堆if语句。 我包含了我的代码,该代码无需循环即可完成工作,以及我尝试使用循环进行操作的代码。 我真的无法理解循环,并且在网上阅读也没有帮助。
这段代码实现了最终目标:
<article>
<h2>Food Menu</h2>
<form>
<input type="checkbox" id="item1" value="8" />
<label for="item1">Fried chicken ($8.00)</label>
<input type="checkbox" id="item2" value="9" />
<label for="item2">Honey Baked Ham ($9.00)</label>
<input type="checkbox" id="item3" value="8" />
<label for="item3">Mac and Cheese ($8.00)</label>
<input type="checkbox" id="item4" value="13" />
<label for="item4">Grilled Salmon ($13.00)</label>
<input type="checkbox" id="item5" value="6" />
<label for="item5">Side salad ($6.00)</label>
<input type="submit" id="submit" value="Submit" />
</form>
<script>
function calcTotal(){
var itemTotal=0;
var item1=document.getElementById("item1");
var item2=document.getElementById("item2");
var item3=document.getElementById("item3");
var item4=document.getElementById("item4");
var item5=document.getElementById("item5");
if(item1.checked==true){itemTotal+=8;}
if(item2.checked==true){itemTotal+=9;}
if(item3.checked==true){itemTotal+=8;}
if(item4.checked==true){itemTotal+=13;}
if(item5.checked==true){itemTotal+=6;}
var salesTaxRate=0.07;
var orderTotal=itemTotal+(itemTotal*salesTaxRate);
document.getElementById("total").innerHTML="Your order total is $"+orderTotal,false;
}
document.getElementById("submit").addEventListener("click",calcTotal,false);
;
</script>
</article>
这段代码是我尝试使用for循环来获得相同结果的努力。
<article>
<h2>Food Menu</h2>
<form>
<input type="checkbox" id="item1" value="8" />
<label for="item1">Fried chicken ($8.00)</label>
<input type="checkbox" id="item2" value="9" />
<label for="item2">Honey Baked Ham ($9.00)</label>
<input type="checkbox" id="item3" value="8" />
<label for="item3">Mac and Cheese ($8.00)</label>
<input type="checkbox" id="item4" value="13" />
<label for="item4">Grilled Salmon ($13.00)</label>
<input type="checkbox" id="item5" value="6" />
<label for="item5">Side salad ($6.00)</label>
<input type="submit" id="submit" value="Submit" />
</form>
<script>
function calcTotal(){
var itemTotal=0;
var items = document.getElementById("input");
var salesTaxRate=0.07;
var orderTotal=itemTotal+(itemTotal*salesTaxRate);
document.getElementById("total").innerHTML="Your order total is $"+orderTotal,false;
for(i=0: i < items.length; i++){
if(input.items[i].checked==true)
orderTotal+=(items[i].value*1);
}
window.alert(itemTotal)
}
document.getElementById("submit").addEventListener("click",calcTotal,false);
;
</script>
</article>
document.getElementsByTagName("input");
。 - 4castle