猿问

回到首页 个人中心 反馈问题 注册登录
下载APP
首页 课程 实战 体系课 手记 专栏 慕课教程

HTML功能无法使用按钮

我有一小部分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:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

    <input type="text" name="blueBags" value=0>

  </p>

  <p>Number of Red bags:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

    <input type="text" name="redBags" value=0>

  </p>

  <p>Number of Yellow bags:&nbsp;&nbsp;&nbsp;&nbsp;

    <input type="text" name="yellowBags" value=0>

  </p>

  <p>Number of Green bags:&nbsp;&nbsp;&nbsp;&nbsp;

    <input type="text" name="greenBags" value=0>

  </p>

  <p>Enter Desired Text:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

    <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;





狐的传说
浏览 848回答 5
5回答

互换的青春

在这里你错过了处理'{}'，你的表单名称是“orderingForm”而不是“form1”试试这个：&nbsp;<html><body><div&nbsp;id="orderForm"> &nbsp;&nbsp;<form&nbsp;name="orderingForm"&nbsp;action="form_action.asp"> &nbsp;&nbsp;<p>Complete&nbsp;this&nbsp;form&nbsp;to&nbsp;order&nbsp;Bags&nbsp;&nbsp;&nbsp;&nbsp;<br> &nbsp;&nbsp;&nbsp;&nbsp;<br>&nbsp;How&nbsp;many&nbsp;of&nbsp;each&nbsp;bag&nbsp;do&nbsp;you&nbsp;want&nbsp;(3p/ea)</p> &nbsp;&nbsp;<p>Number&nbsp;of&nbsp;Blue&nbsp;bags:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input&nbsp;type="text"&nbsp;name="blueBags"&nbsp;value=0> &nbsp;&nbsp;</p> &nbsp;&nbsp;<p>Number&nbsp;of&nbsp;Red&nbsp;bags:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input&nbsp;type="text"&nbsp;name="redBags"&nbsp;value=0> &nbsp;&nbsp;</p> &nbsp;&nbsp;<p>Number&nbsp;of&nbsp;Yellow&nbsp;bags:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input&nbsp;type="text"&nbsp;name="yellowBags"&nbsp;value=0> &nbsp;&nbsp;</p> &nbsp;&nbsp;<p>Number&nbsp;of&nbsp;Green&nbsp;bags:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input&nbsp;type="text"&nbsp;name="greenBags"&nbsp;value=0> &nbsp;&nbsp;</p> &nbsp;&nbsp;<p>Enter&nbsp;Desired&nbsp;Text:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;<input&nbsp;type="text"&nbsp;name="textBags"&nbsp;value="Enter&nbsp;Your&nbsp;text&nbsp;here"> &nbsp;&nbsp;&nbsp;&nbsp;<p>Minimum&nbsp;order&nbsp;100&nbsp;bags</p> &nbsp;&nbsp;&nbsp;&nbsp;<input&nbsp;type="button"&nbsp;value="Click&nbsp;to&nbsp;Order"&nbsp;onClick="Order()"> &nbsp;&nbsp;</form></div></body><!--Script&nbsp;for&nbsp;the&nbsp;ordering&nbsp;system--><script> &nbsp;&nbsp;<!--&nbsp;extra&nbsp;functions&nbsp;to&nbsp;check&nbsp;if&nbsp;input&nbsp;is&nbsp;an&nbsp;integer&nbsp;--> &nbsp;&nbsp;function&nbsp;isInt(n)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;return&nbsp;n&nbsp;%&nbsp;1&nbsp;===&nbsp;0; &nbsp;&nbsp;} &nbsp;&nbsp;function&nbsp;Order()&nbsp;{console.log("hai") &nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;amountB&nbsp;=&nbsp;document.orderingForm.blueBags.value; &nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;amountR&nbsp;=&nbsp;document.orderingForm.redBags.value; &nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;amountY&nbsp;=&nbsp;document.orderingForm.yellowBags.value; &nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;amountG&nbsp;=&nbsp;document.orderingForm.greenBags.value; &nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;text&nbsp;=&nbsp;document.orderingForm.textBags.value; &nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;total&nbsp;=&nbsp;amountB&nbsp;+&nbsp;amountR&nbsp;+&nbsp;amountY&nbsp;+&nbsp;amountG; &nbsp;&nbsp;&nbsp;&nbsp;if&nbsp;(isInt(orderingForm.blueBags.value)&nbsp;==&nbsp;true&nbsp;&&&nbsp;isInt(orderingForm.redBags.value)&nbsp;==&nbsp;true&nbsp;&&&nbsp;isInt(orderingForm.yellowBags.value)&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;==&nbsp;true&nbsp;&&&nbsp;isInt(orderingForm.greenBags.value)&nbsp;==&nbsp;true)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if&nbsp;(total&nbsp;>&nbsp;100)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;cost&nbsp;=&nbsp;(total&nbsp;*&nbsp;0.03); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;alert("Order&nbsp;Confirmed"); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;else&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;alert("Minimum&nbsp;order&nbsp;is&nbsp;100&nbsp;bags."); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} &nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;else&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;alert("One&nbsp;or&nbsp;more&nbsp;of&nbsp;the&nbsp;forms&nbsp;doesn't&nbsp;contain&nbsp;a&nbsp;quantity&nbsp;for&nbsp;order."); &nbsp;&nbsp;&nbsp;&nbsp;}}</script>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</html>希望它对你有所帮助。
0

慕后森

你用过..而且错过了}。试试这个<div&nbsp;id="orderForm"> &nbsp;&nbsp;<form&nbsp;name="orderingForm"&nbsp;action="form_action.asp"> &nbsp;&nbsp;<p>Complete&nbsp;this&nbsp;form&nbsp;to&nbsp;order&nbsp;Bags&nbsp;&nbsp;&nbsp;&nbsp;<br> &nbsp;&nbsp;&nbsp;&nbsp;<br>&nbsp;How&nbsp;many&nbsp;of&nbsp;each&nbsp;bag&nbsp;do&nbsp;you&nbsp;want&nbsp;(3p/ea)</p> &nbsp;&nbsp;<p>Number&nbsp;of&nbsp;Blue&nbsp;bags:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input&nbsp;type="text"&nbsp;name="blueBags"&nbsp;value=0> &nbsp;&nbsp;</p> &nbsp;&nbsp;<p>Number&nbsp;of&nbsp;Red&nbsp;bags:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input&nbsp;type="text"&nbsp;name="redBags"&nbsp;value=0> &nbsp;&nbsp;</p> &nbsp;&nbsp;<p>Number&nbsp;of&nbsp;Yellow&nbsp;bags:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input&nbsp;type="text"&nbsp;name="yellowBags"&nbsp;value=0> &nbsp;&nbsp;</p> &nbsp;&nbsp;<p>Number&nbsp;of&nbsp;Green&nbsp;bags:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input&nbsp;type="text"&nbsp;name="greenBags"&nbsp;value=0> &nbsp;&nbsp;</p> &nbsp;&nbsp;<p>Enter&nbsp;Desired&nbsp;Text:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;<input&nbsp;type="text"&nbsp;name="textBags"&nbsp;value="Enter&nbsp;Your&nbsp;text&nbsp;here"> &nbsp;&nbsp;&nbsp;&nbsp;<p>Minimum&nbsp;order&nbsp;100&nbsp;bags</p> &nbsp;&nbsp;&nbsp;&nbsp;<input&nbsp;type="button"&nbsp;value="Click&nbsp;to&nbsp;Order"&nbsp;onClick="Order()"> &nbsp;&nbsp;</form></div><!--Script&nbsp;for&nbsp;the&nbsp;ordering&nbsp;system--><script> &nbsp;&nbsp;<!--&nbsp;extra&nbsp;functions&nbsp;to&nbsp;check&nbsp;if&nbsp;input&nbsp;is&nbsp;an&nbsp;integer&nbsp;--> &nbsp;&nbsp;function&nbsp;isInt(n)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;return&nbsp;n&nbsp;%&nbsp;1&nbsp;===&nbsp;0; &nbsp;&nbsp;} &nbsp;&nbsp;function&nbsp;Order()&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;amountB&nbsp;=&nbsp;document.orderingForm.blueBags.value; &nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;amountR&nbsp;=&nbsp;document.orderingForm.redBags.value; &nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;amountY&nbsp;=&nbsp;document.orderingForm.yellowBags.value; &nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;amountG&nbsp;=&nbsp;document.orderingForm.greenBags.value; &nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;text&nbsp;=&nbsp;document.orderingForm.textBags.value; &nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;total&nbsp;=&nbsp;amountB&nbsp;+&nbsp;amountR&nbsp;+&nbsp;amountY&nbsp;+&nbsp;amountG; &nbsp;&nbsp;&nbsp;&nbsp;//if&nbsp;(isInt(form1.blueBags.value)&nbsp;==&nbsp;true&nbsp;&&&nbsp;isInt(form1.redBags.value)&nbsp;==&nbsp;true&nbsp;&&&nbsp;isInt(form1.yellowBags.value)&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;==&nbsp;true&nbsp;&&&nbsp;isInt(form1.greenBags.value)&nbsp;==&nbsp;true)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if&nbsp;(total&nbsp;>&nbsp;100)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;//&nbsp;&nbsp;var&nbsp;cost&nbsp;=&nbsp;(total&nbsp;*&nbsp;0.03); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;//if&nbsp;(confirm("CONFIRM&nbsp;ORDER:&nbsp;/n&nbsp;blue&nbsp;bags:&nbsp;"&nbsp;+&nbsp;form1.blueBags.value&nbsp;+&nbsp;"/n&nbsp;red&nbsp;bags:&nbsp;"&nbsp;+&nbsp;form1.redBags.value &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;+&nbsp;"/n&nbsp;yellow&nbsp;bags:&nbsp;"&nbsp;+&nbsp;form1.yellowBags.value&nbsp;+&nbsp;"/n&nbsp;green&nbsp;bags:&nbsp;"&nbsp;+&nbsp;form1.greenBags.value&nbsp;+&nbsp;"/n&nbsp;Desired&nbsp;Text:&nbsp;"&nbsp;+&nbsp;text))&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;alert("Order&nbsp;Confirmed"); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;//&nbsp;&nbsp;}&nbsp;else&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;//&nbsp;&nbsp;&nbsp;&nbsp;alert("Order&nbsp;Cancelled"); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;//&nbsp;&nbsp;} &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;else&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;alert("Minimum&nbsp;order&nbsp;is&nbsp;100&nbsp;bags."); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} &nbsp;&nbsp;&nbsp;&nbsp;//}else&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;//&nbsp;&nbsp;alert("One&nbsp;or&nbsp;more&nbsp;of&nbsp;the&nbsp;forms&nbsp;doesn't&nbsp;contain&nbsp;a&nbsp;quantity&nbsp;for&nbsp;order."); &nbsp;&nbsp;//&nbsp;&nbsp;}}</script>
0

炎炎设计

替换行如下：var&nbsp;text&nbsp;=&nbsp;document.orderingForm.textBags.value;并添加两个值使用parseInt(value)或parseFloat(value)作为：var&nbsp;r&nbsp;=&nbsp;parseInt(amountB)&nbsp;+&nbsp;parseInt(amountR);
0

交互式爱情

.从此行中删除var&nbsp;text&nbsp;=&nbsp;document.orderingForm..textBags.value;写var&nbsp;text&nbsp;=&nbsp;document.orderingForm.textBags.value;并关闭}代码的结尾
0
打开App，查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript