Question

如何为复选框添加费用。当我添加一个onClick它说myFunction没有定义。我不知道我在做什么。我试图用第二个函数进行检查，所以如果检查它会将成本加在一起并进行小计但我无法使其工作或找到一种方法将成本变为复选框中的值< / p>

<html>
   <body>
      <p>A pizza is 13 dollars with no toppings.</p>
      <form action="form_action.asp">
         <input type="checkbox" name="pizza" value="Pepperoni" id="pep" > Pepperoni + 5$<br>
         <input type="checkbox" name="pizza" value="Cheese" id="ch" >Cheese + 4$<br>
         <br>
         <input type="button" onClick="myFunction()" value="Send order"><br>
         <input type="button" onClick="cost()" value="Get cost" > <br>
         <input type="text" id="order" size="50">
      </form>
      <script type="text/javascript">
         function myFunction() {
             var pizza = document.forms[0];
             var txt = "";
             var i;
             for (i = 0; i < pizza.length; i++) {
                 if (pizza[i].checked) {  // this shows the you ordered the pizza with blank topping 
                     txt = txt + pizza[i].value + " ";
                 }
             }
             document.getElementById("order").value = "You ordered a pizza with: " +    txt;
         }


         function cost() {
           var x = document.getElementById(pep).checked;  // this is the failed check and i dont know how to fix it and get it to add a cost
           document.getElementById("demo").innerhtml = x;
         }
      </script>
      <p id="demo"></p>
   </body>
</html>

Answer 1

回答https://stackoverflow.com/users/7488236/manish-poduval

<html>
<body>

<p>A pizza is 13 dollars with no toppings.</p>

<form action="form_action.asp">
<input type="checkbox" name="pizza" value="Pepperoni" id="pep">Pepperoni + 5$<br>
<input type="checkbox" name="pizza" value="Cheese" id="che">Cheese + 4$<br>
<br>
<input type="button" onclick="myFunction()" value="Send order">
<input type="button" onclick="cost()" value="Get cost">
<br><br>
 <input type="text" id="order" size="50">
 </form>

<script>
function myFunction() {
var pizza = document.forms[0];
var txt = "";
var i;
for (i = 0; i < pizza.length; i++) {
    if (pizza[i].checked) {
        txt = txt + pizza[i].value + " ";
    }
}
document.getElementById("order").value = "You ordered a pizza with: " + txt;
}

function cost() {
var pep = 5;
var che = 4;
var pizza = 13;
var total = 0;
if (document.getElementById("pep").checked === true) {
  total += pep;
}

if (document.getElementById("che").checked === true) {
  total += che;
}
  document.getElementById("order").value = "The cost is : " + total;
}

</script>

</body>
</html>

Answer 2

document.getElementById("pep").checked;

您尚未正确写入此行。在此之后检查x的值是否为真，然后将值5 $添加到13 $并将其加总，并将其显示在文本字段中。

让我知道它是否有效。

Javascript - 如何增加成本？

2 个答案: