我有一点点HTML和JS，我不能在我的生活中获得使用按钮的功能。我尝试了很多东西，并改变了创建按钮和文本框的不同风格，但我无法弄清楚如何修复它 这是代码：
<div id="orderForm">
<form name="orderingForm" action="form_action.asp">
<p>Complete this form to order Bags
<br>
<br> How many of each bag do you want (3p/ea)</p>
<p>Number of Blue bags:
<input type="text" name="blueBags" value=0>
</p>
<p>Number of Red bags:
<input type="text" name="redBags" value=0>
</p>
<p>Number of Yellow bags:
<input type="text" name="yellowBags" value=0>
</p>
<p>Number of Green bags:
<input type="text" name="greenBags" value=0>
</p>
<p>Enter Desired Text:
<input type="text" name="textBags" value="Enter Your text here">
<p>Minimum order 100 bags</p>
<input type="button" value="Click to Order" onClick="Order()">
</form>
</div>
<!--Script for the ordering system-->
<script>
<!-- extra functions to check if input is an integer -->
function isInt(n) {
return n % 1 === 0;
}
function Order() {
var amountB = document.orderingForm.blueBags.value;
var amountR = document.orderingForm.redBags.value;
var amountY = document.orderingForm.yellowBags.value;
var amountG = document.orderingForm.greenBags.value;
var text = document.orderingForm.textBags.value;
var total = amountB + amountR + amountY + amountG;
if (isInt(form1.blueBags.value) == true && isInt(form1.redBags.value) == true && isInt(form1.yellowBags.value) == true && isInt(form1.greenBags.value) == true) {
if (total > 100) {
var cost = (total * 0.03);
//if (confirm("CONFIRM ORDER: /n blue bags: " + form1.blueBags.value + "/n red bags: " + form1.redBags.value + "/n yellow bags: " + form1.yellowBags.value + "/n green bags: " + form1.greenBags.value + "/n Desired Text: " + text)) {
alert("Order Confirmed");
} else {
alert("Order Cancelled");
}
} else {
alert("Minimum order is 100 bags.");
}
} else {
alert("One or more of the forms doesn't contain a quantity for order.");
}
}
</script>
答案 0 :(得分：1)
这里你错过了使用'{}'处理，你的表单名称是“orderingForm”而不是“form1”
试试这个：
<html>
<body>
<div id="orderForm">
<form name="orderingForm" action="form_action.asp">
<p>Complete this form to order Bags
<br>
<br> How many of each bag do you want (3p/ea)</p>
<p>Number of Blue bags:
<input type="text" name="blueBags" value=0>
</p>
<p>Number of Red bags:
<input type="text" name="redBags" value=0>
</p>
<p>Number of Yellow bags:
<input type="text" name="yellowBags" value=0>
</p>
<p>Number of Green bags:
<input type="text" name="greenBags" value=0>
</p>
<p>Enter Desired Text:
<input type="text" name="textBags" value="Enter Your text here">
<p>Minimum order 100 bags</p>
<input type="button" value="Click to Order" onClick="Order()">
</form>
</div>
</body>
<!--Script for the ordering system-->
<script>
<!-- extra functions to check if input is an integer -->
function isInt(n) {
return n % 1 === 0;
}
function Order() {
console.log("hai")
var amountB = document.orderingForm.blueBags.value;
var amountR = document.orderingForm.redBags.value;
var amountY = document.orderingForm.yellowBags.value;
var amountG = document.orderingForm.greenBags.value;
var text = document.orderingForm.textBags.value;
var total = amountB + amountR + amountY + amountG;
if (isInt(orderingForm.blueBags.value) == true && isInt(orderingForm.redBags.value) == true && isInt(orderingForm.yellowBags.value) == true && isInt(orderingForm.greenBags.value) == true) {
if (total > 100) {
var cost = (total * 0.03);
alert("Order Confirmed");
} else {
alert("Minimum order is 100 bags.");
}
} else {
alert("One or more of the forms doesn't contain a quantity for order.");
}
}
</script>
</html>
答案 1 :(得分：0)
你用过......而且错过了}。试试这个
<div id="orderForm">
<form name="orderingForm" action="form_action.asp">
<p>Complete this form to order Bags
<br>
<br> How many of each bag do you want (3p/ea)</p>
<p>Number of Blue bags:
<input type="text" name="blueBags" value=0>
</p>
<p>Number of Red bags:
<input type="text" name="redBags" value=0>
</p>
<p>Number of Yellow bags:
<input type="text" name="yellowBags" value=0>
</p>
<p>Number of Green bags:
<input type="text" name="greenBags" value=0>
</p>
<p>Enter Desired Text:
<input type="text" name="textBags" value="Enter Your text here">
<p>Minimum order 100 bags</p>
<input type="button" value="Click to Order" onClick="Order()">
</form>
</div>
<!--Script for the ordering system-->
<script>
<!-- extra functions to check if input is an integer -->
function isInt(n) {
return n % 1 === 0;
}
function Order() {
var amountB = document.orderingForm.blueBags.value;
var amountR = document.orderingForm.redBags.value;
var amountY = document.orderingForm.yellowBags.value;
var amountG = document.orderingForm.greenBags.value;
var text = document.orderingForm.textBags.value;
var total = amountB + amountR + amountY + amountG;
//if (isInt(form1.blueBags.value) == true && isInt(form1.redBags.value) == true && isInt(form1.yellowBags.value) == true && isInt(form1.greenBags.value) == true) {
if (total > 100) {
// var cost = (total * 0.03);
//if (confirm("CONFIRM ORDER: /n blue bags: " + form1.blueBags.value + "/n red bags: " + form1.redBags.value + "/n yellow bags: " + form1.yellowBags.value + "/n green bags: " + form1.greenBags.value + "/n Desired Text: " + text)) {
alert("Order Confirmed");
// } else {
// alert("Order Cancelled");
// }
} else {
alert("Minimum order is 100 bags.");
}
//}else {
// alert("One or more of the forms doesn't contain a quantity for order.");
// }
}
</script>
答案 2 :(得分：0)
首先，请不要在<script>标记之间使用HTML评论，因为您有：
<!-- extra functions to check if input is an integer -->
您在..处的语法错误应为.“单点”，如您所示：
var text = document.orderingForm..textBags.value;
这应该是这样的：
var text = document.orderingForm.textBags.value;
最后，您没有关闭Order() function结尾括号。
查看这个小提琴：http://jsfiddle.net/c5496q92/
更新了解HTML和JavaScript中的评论：
如果要在HTML中添加一些注释，可以使用：
<!-- Your Comments -->
如果您使用的是.js文件或<script></script>个标签，则应使用：
/* For multi-line comments */
// For singular line comment
您可以在以下网址了解更多信息：
答案 3 :(得分：0)
按如下方式替换该行：
var text = document.orderingForm.textBags.value;
并添加两个值，使用parseInt(value)或parseFloat(value)作为：
var r = parseInt(amountB) + parseInt(amountR);
答案 4 :(得分：-1)
从此行中删除.
var text = document.orderingForm..textBags.value;
写
var text = document.orderingForm.textBags.value;
并关闭代码的}结尾