こんにちは、これは初めてのことですが、ピザを注文できるプログラムを作成しました。注文したものが表示されますが、最後の項目の末尾に「and」がある場所を作成する必要があります.....例: あなた手でクラストをトスしたピザを注文しました。次のトッピングがあります: ペパロニ、ハンバーガー、ピーマン、マッシュルーム。私はそれが必要ですが、そこに入れることができないようです。ここで行う助けは私の小さなプログラムです
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>PIZZA!</title>
<script type="text/javascript">
function vOrder() {
var strCrust, strOrder, iToppingCount, iMeatCount;
document.getElementById("taOrder").value = "";
strCrust = document.getElementById("ddlCrust").value;
strOrder = "You ordered a pizza with " + strCrust + " crust.\n";
iToppingCount = 0;
iMeatCount = 0;
strToppings = "";
if (document.getElementById("chkPepperoni").checked) {
iToppingCount++; //same as iToppingCount += 1
strToppings += "pepperoni";
iMeatCount++;
}
if (document.getElementById("chkHamburger").checked) {
if (iToppingCount > 0)
strToppings += ", ";
iToppingCount++;
strToppings += "hamburger";
iMeatCount++;
}
if (document.getElementById("chkGreenPeppers").checked) {
if (iToppingCount > 0)
strToppings += ", ";
iToppingCount++;
strToppings += "green peppers";
}
if (document.getElementById("chkMushrooms").checked) {
if (iToppingCount > 0)
strToppings += ", ";
iToppingCount++;
strToppings += "mushrooms";
}
if (document.getElementById("chkOnion").checked) {
if (iToppingCount > 0)
strToppings += ", ";
iToppingCount++;
strToppings += "onions";
}
if (document.getElementById("chkSausage").checked) {
if (iToppingCount > 0)
strToppings += ", ";
iToppingCount++;
strToppings += "sausage";
iMeatCount++;
}
if (iToppingCount > 0)
strToppings = "You have the following toppings: " + strToppings;
else
strToppings = "Your pizza is a plain cheese.";
if (iMeatCount > 2)
strOrder = "screw you no more then two";
else
strOrder += strToppings;
document.getElementById("taOrder").value = strOrder;
}
</script>
<style type="text/css">
hr {
color:firebrick;
height:4px;
}
</style>
</head>
<body>
<div style="border-style:groove; border-color:firebrick; border-width:5px; margin:auto; width:4.5in; background-color:bisque">
<form action="pizza_ddl_chk.html">
<table style="width:100%">
<tr>
<td style="width:100px">
<img src="images/pizza.jpg" width="100" alt="Tasty pizza!" />
</td>
<td style="font-size:30pt;font-family:Biondi;text-align:center">
<span style="color:green">That's</span>
<span style="color:white">A</span>
<span style="color:red">Pizza!</span>
</td>
</tr>
<tr>
<td colspan="2"><hr /></td>
</tr>
<tr>
<td>Choose your crust:</td>
<td>
<select id="ddlCrust">
<option value="thin">Thin</option>
<option value="thick">Thick</option>
<option value="hand-tossed">Hand-tossed</option>
</select>
</td>
</tr>
<tr>
<td>Choose your toppings:</td>
<td>
<table>
<tr>
<td>Pepperoni</td>
<td>
<input type="checkbox" id="chkPepperoni" />
</td>
<td>Sausage</td>
<td>
<input type="checkbox" id="chkSausage" />
</td>
<td>Onion</td>
<td>
<input type="checkbox" id="chkOnion" />
</td>
</tr>
<tr>
<td>Hamburger</td>
<td>
<input type="checkbox" id="chkHamburger" />
</td>
<td>Green Peppers</td>
<td>
<input type="checkbox" id="chkGreenPeppers" />
</td>
<td>Mushrooms</td>
<td>
<input type="checkbox" id="chkMushrooms" />
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td colspan="2" style="text-align:center"><input type="button" id="btnOrder" value="Place Your Order" onclick="vOrder()"/></td>
</tr>
<tr>
<td colspan="2"><hr /></td>
</tr>
<tr>
<td colspan="2">
<textarea id="taOrder" cols="49" rows="4"></textarea>
</td>
</tr>
</table>
</form>
</div>
</body>
</html>