How*_*Gee 1 javascript checkbox running-total radio
我有这个简单的脚本.我正在尝试获取已检查的值并将它们添加到已打开的输入框中的运行总计中.我知道它正在检查选项,但它没有更新到输入框,我不知道为什么.谁能帮我？
<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/看到它在行动.