Javascript收音机/复选框问题

问题描述：

我有这个简单的脚本。我试图获取选中的值并将它们添加到位于diabled输入框中的运行总计中。我知道它正在检查选项，但它不更新到输入框，我不知道为什么。谁能帮我？Javascript收音机/复选框问题

<html> 
<head> 
<script type="text/javascript"> 
    function updateForm() 
    { 
     var type = document.pizzaForm.pizzaType; 
     var toppings = document.pizzaForm.toppings; 
     var pizzaType; 
     var toppings; 

     for(var i = 0; i <= type.length; i++) 
     { 
      if(type[i].checked) 
      { 
       total = type[i].value; 
      } 
     } 

     for(var i = 0; i <= toppings.length; i++) 
     { 
      if(toppings[i].checked) 
      { 
       toppings += toppings[i].value; 
      } 
     } 

     var total = pizzaType + toppings; 

     pizzaForm.total.value = total; 
    } 
</script> 
</head> 
<body> 
    <h1>Order Pizza Here:</h1> 
    <form action="" method="get" name="pizzaForm"> 
     What Type of Pizza Would You Like? <br /> 
     <input type="radio" name="pizzaType" value="10.00" onchange="updateForm()" />Vegetarian<br /> 
     <input type="radio" name="pizzaType" value="20.00" onchange="updateForm()" />Meat Lovers<br /> 
      <br /> 
      <br /> 
     Extra Toppings: <br /> 
     <input type="checkbox" name="toppings" value="2.00" onchange="updateForm()" />Extra Cheese <br /> 
     <input type="checkbox" name="toppings" value="3.00" onchange="updateForm()" />Mushrooms <br /> 
     <input type="checkbox" name="toppings" value="4.00" onchange="updateForm()" />Anchovies <br /> 
      <br /> 
     Total <input type="text" disabled="disabled" name="total" /> 
    </form> 
</body> 
</html>

答

你有几个基本的Javascript错误：

您的for循环看起来像：
```
for(var i = 0; i <= type.length; i++) 
```
，这意味着他们会从0到长度（包括长度）=长度+ 1
应该是：
```
for(var i = 0; i < type.length; i++) 
```
看到差异？ <=现在是<。 （关闭一个错误？）
您正在使用toppings变量两次。 （javascript对你来说真的很糟糕，可以让你在脚下拍摄自己。）你也应该初始化所有的值。
```
var type = document.pizzaForm.pizzaType; 
var toppings = document.pizzaForm.toppings; 
var pizzaTypeValue = 0; 
var toppingsValue = 0; 
```
我还添加了Value到持有数而不是元素的变量。其他人可能会在此前缀或某些此类惯例的前缀记住它保存的值不是元素列表。
中标记的值是字符串使用parseFloat(把它们变成浮动：
```
pizzaTypeValue += parseFloat(type[i].value); 
```
还要注意+=手段：这添加到我。相当于pizzaTypeValue = pizzaTypeValue + ...。
总变量没有实际需要。只要添加评论，如果你想记住它是总数。

看到这个jsFiddle: http://jsfiddle.net/F53ae/看到它的行动。

+1击败我吧。好总结。你不需要两个总变量，只需将所有内容合并成一个，但这很小。最好在顶部定义一个计数器而不是声明两次“var i”。 – Dennis

@丹尼斯你对两个总变量和声明'i'两次都是正确的。我想我的答案有点长，我不认为这些东西真的需要。此外，我还假设这是一个家庭作业问题（让我想起我在数据结构课中做过的一个，除了我们必须使用C++），并且我想在其中留下一些OP的痕迹。 ;） –

是的，我真的希望浏览器的JavaScript调试器像大多数编程IDE一样更深入。我完全忘了，即使值是一个数字，它仍然是一个字符串！谢谢！我仍然不太了解“

答

以下是工作代码。我把它放在你身边。主要的问题是你有两个变量名为toppings。另外，在第一个循环中，当您打算设置其他总数时，您将设置“总计”变量。一探究竟。 http://jsfiddle.net/eXPAj/1/

我希望我能给你两个绿色的支票，但上面的海报有一个更深入的解释。谢谢你！ –

不用担心。 @Howdy_McGee – frosty

Javascript收音机/复选框问题

相关推荐