我剛剛開始學習JavaScript和HTML,目前我正在爲一個項目開發比薩交付程序。在該人員下達命令(將其輸入到表單並單擊命令按鈕)之後,它會輸出到文本區域中。Textarea不想清除(點擊按鈕時)
如果有人訂購了其他東西(再次點擊訂單按鈕),文本區域應該被清除,但它不會清除。我嘗試了很多我在SO和W3School上發現的東西,但它不想清除文本區域。
代碼以空textarea的:(幾乎在內的頂部線orderPizzas起作用)的textarea的處於底部的我的代碼的<body>
與ID內:詳細
document.getElementById("Details").value = "";
這是我的代碼:
var pizzaCount = 0;
var gourmetPrice = 15.50;
var standardPrice = 9.50;
var deliveryCharge = 5;
var TotalPrice;
var name;
var adress;
var phoneNumber = 10;
var gourmetCount = 0;
var standardCount = 0;
var orderDetails = '';
function orderPizzas() {
var customerDetails;
var i = 0;
var j = 0;
TotalPrice = 0;
phoneNumber = '';
document.getElementById("Details").value = "";
var arrStandardPizza = new Array()
arrStandardPizza[0] = new Array();
arrStandardPizza[0]['name'] = 'Hawaiian';
arrStandardPizza[0]['amount'] = Number(document.standard.Hawaiian.value);
arrStandardPizza[1] = new Array();
arrStandardPizza[1]['name'] = 'Cheese';
arrStandardPizza[1]['amount'] = Number(document.standard.Cheese.value);
arrStandardPizza[2] = new Array();
arrStandardPizza[2]['name'] = 'Veggie';
arrStandardPizza[2]['amount'] = Number(document.standard.Veggie.value);
arrStandardPizza[3] = new Array();
arrStandardPizza[3]['name'] = 'Supreme';
arrStandardPizza[3]['amount'] = Number(document.standard.Supreme.value);
arrStandardPizza[4] = new Array();
arrStandardPizza[4]['name'] = 'Pepperoni';
arrStandardPizza[4]['amount'] = Number(document.standard.Pepperoni.value);
var arrGourmetPizza = new Array()
arrGourmetPizza[0] = new Array();
arrGourmetPizza[0]['name'] = 'Meatlovers';
arrGourmetPizza[0]['amount'] = Number(document.gourmet.Meatlovers.value);
arrGourmetPizza[1] = new Array();
arrGourmetPizza[1]['name'] = 'Chicken';
arrGourmetPizza[1]['amount'] = Number(document.gourmet.Chicken.value);
arrGourmetPizza[2] = new Array();
arrGourmetPizza[2]['name'] = 'Prawn';
arrGourmetPizza[2]['amount'] = Number(document.gourmet.Prawn.value);
standardCount = arrStandardPizza[0]['amount'] + arrStandardPizza[1]['amount'] + arrStandardPizza[2]['amount'] + arrStandardPizza[3]['amount'] + arrStandardPizza[4]['amount'];
gourmetCount = arrGourmetPizza[0]['amount'] + arrGourmetPizza[1]['amount'] + arrGourmetPizza[2]['amount'];
pizzaCount = standardCount + gourmetCount;
if (pizzaCount > 12) {
alert('A maximum of 12 pizzas can be ordered.\nPlease modify your order.\nPizzas ordered: ' + pizzaCount);
} else {
while (i < 5) {
if (arrStandardPizza[i]['amount'] > 0) {
orderDetails = orderDetails + '\n' + arrStandardPizza[i]['name'] + ': ' + arrStandardPizza[i]['amount'];
}
i++;
}
while (j < 3) {
if (arrGourmetPizza[j]['amount'] > 0) {
orderDetails = orderDetails + '\n' + arrGourmetPizza[j]['name'] + ': ' + arrGourmetPizza[j]['amount'];
}
j++;
}
if (document.getOrderMethod.method.value == 'Delivery') {
name = prompt('What is your name?');
adress = prompt('What is your adress?');
while (phoneNumber.toString().length !== 10) {
phoneNumber = prompt('What is your phone number?');
}
customerDetails = '\nDelivery:\n' + 'Name: ' + name + ' ' + '\n' + 'Adress: ' + adress + '\n' + 'Phone Number: ' + phoneNumber;
TotalPrice = deliveryCharge;
} else {
name = prompt('What is your name?');
customerDetails = '\nPick-up:\n' + 'Customer Name: ' + name;
}
TotalPrice = TotalPrice + (standardCount * standardPrice) + (gourmetCount * gourmetPrice);
orderDetails = orderDetails + customerDetails + '\n' + 'Total Cost: $' + TotalPrice;
document.getElementById("Details").value = orderDetails;
}
}
<!DOCTYPE html>
<html>
<head>
<title> Pete's Pizza </title>
</head>
<body>
<h1> Welcome to Pete's Pizzas, where the best pizzas are! </h1>
<h3> Enter your pizza order: </h3>
<label> Amount for each standard pizza </label>
<form name="standard">
<input type="text" name="Hawaiian"> Hawaiian Pizza <br>
<input type="text" name="Cheese"> Cheese Pizza <br>
<input type="text" name="Veggie"> Veggie Pizza <br>
<input type="text" name="Supreme"> Supreme Pizza <br>
<input type="text" name="Pepperoni"> Pepperoni Pizza <br>
</form>
<label> Amount for each gourmet pizza </label>
<form name="gourmet">
<input type="text" name="Meatlovers"> Meat-lovers Pizza <br>
<input type="text" name="Chicken"> Chicken Pizza <br>
<input type="text" name="Prawn"> Prawn <br>
</form>
<form name="getOrderMethod">
<input type="radio" name="method" value="Delivery" checked> Delivery <br>
<input type="radio" name="method" value="Pick-up"> Pick-up <br>
</form>
<input type="button" value="Confirm Order" onClick="orderPizzas()">
<input type="button" value="Cancel Order" onClick="window.location.reload()">
<textarea id="Details" value="" rows="9" cols="33" wrap=on readonly></textarea>
</body>
</html>
我很新的JavaScript和HTML,所有的建議將大受歡迎。提前致謝。
你試圖用來清除textarea的代碼在哪裏?我們無法幫助您解決我們看不到的問題!此外,它會幫助您創建一個[最小,完整和可驗證的示例](https://stackoverflow.com/help/mcve),並在[可運行的代碼片段]中使用* relevalt *代碼(https:/ /stackoverflow.blog/2014/09/16/introducing-runnable-javascript-css-and-html-code-snippets/) – FluffyKitten
您已突出顯示清除textarea的行。現在看看其他行設置textarea的值並仔細檢查這些值。順便說一句,不斷地拒絕用戶的電話號碼,而不告訴他們你期望的格式是非常煩人的。 – nnnnnn
我已注意到您的意見@nnnnnn,並感謝您的幫助和建議! – Stefan