Question

我是Javascript的新手，我正在进行一项在线发现的练习。问题是循环没有从表单中获取值，因此运行计数永远不会更新。任何帮助表示赞赏。

实际上还有一个问题，您是否知道为什么没有从选中的输入框中获取值？即使我遍历循环，函数也会返回零。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>

</head>
<body>
<h1>Configure Your GT Super Sportscar</h1>
<form id="orderform" action="#">
<table border="1">

<tr>

<td><input type="radio" name="manual" checked="checked" id="manual" value="17790.00" />GT Manual</td><td>$17,790.00</td> 
</tr>
<tr>
<td><input type="radio" name="manual" id="auto" value="18590.00" />GT Automatic</td><td>$18,590.00</td>
</tr>
<tr>
<td><input type="radio" name="manual" id="smanual" value="22455.00" />GT-S Manual</td><td>$22,455.00</td>
</tr>
<tr>
<td><input type="radio" name="manual" id="sshift" value="23155.00"/>GT-S Sportshift</td><td>$23,155.00</td>
</tr>
</table>
<table border="1">

<tr>
<td><input type="radio" name="manual" id="combo1" value="1235.00" />Option Combo #1</td><td>$1235.00</td>
</tr>
<tr>
<td><input type="radio" name="manual" id="combo2" value="3354.00" />Option Combo #2
<ul>
<li>Rear Spoiler and Fog Lamps</li>
<li>Keyless Entry</li>
<li>Power Tint and Side Moonroof</li>
<li>Power Windows, Doors, and Cruise Control</li>
</ul>
</td>
<td>$3354.00</td>
</tr>
<tr>
<td><input type="radio" name="manual" id="nocombo" value="0" />No Combo</td><td>$0</td>
</tr>

</table>
<table border="1">

<tr>

<td><input type="checkbox" name="amen" id="cac" value="550.00"/>CD Autochanger</td><td>$550.00</td> 
</tr>
<tr>
<td><input type="checkbox" name="amen" id="vss" value="399.00"/>VIP Security System</td><td>$399.00</td>
</tr>
<tr>
<td><input type="checkbox" name="amen" id="adm" value="295.00"/>Auto Dimming Mirror</td><td>$295.00</td>
</tr>

</table>
<table border="1">

<tr>
<td><input type="text" name="price" id="price" /></td><td><input type="button" onclick="showit()" value="Calculate Total" /></td>
</tr>
</table>
</form>
<script type="text/javascript">
/**
* @author Isaac's
*/
function getval(){
var options = document.forms["orderform"].manual;
var optionslength = options.length;
var total = 0;
for (var i = 0; i &lt; optionslength; i++) {
if (options[i].checked) {
options[i].value += total;
}
return total;
}
}
var result1 = getval();
function getval2(){
var total=0;
var checkboxes = document.forms["orderform"].amen;
for (var i = 0; i &lt; checkboxes.length; i++) {
checkboxes[i].value += total;
}
return total;
}

var result2 = getval2();

function showit(){
var total = parseFloat(result1) + parseFloat(result2)
alert(total);
}

</script> 
</body>
</html>

Answer 1

代码有多个问题。

这是你可以玩的working jsFiddle example。

阻止您的代码工作有四大问题：

在if循环中，当你想要添加到你写的总数时：
```
options[i].value += total;
```
这将对options[i].value采取行动。您想要更改total，因此您应该写
```
total += parseFloat(options[i].value);
```

在getval()中，您从内部返回for循环，如下所示：

function getval(){
    var options = document.forms["orderform"].manual;
    var optionslength = options.length;
    var total = 0;
    for (var i = 0; i &lt; optionslength; i++) {
        if (options[i].checked) {
            options[i].value += total;
        }
        return total; // <=======   THIS IS STILL INSIDE THE FOR LOOP!!!!!!!!
    }
}

您想要计算所有>之后的总，所以像这样：

function getval(){ var options = document.forms["orderform"].manual; var optionslength = options.length; var total = 0; for (var i = 0; i < optionslength; i++) { if (options[i].checked) { total += parseFloat(options[i].value); } } return total; // <===== ALL CALCULATIONS ARE COMPLETED, SO WE CAN RETURN. }

最后在getval2()中，您忘记检查是否已将这些复选框添加到总计中。所以你总是得到相同的总数。您可以检查getval()中是否选中了复选框。在getval2()。

中使用相同的方法

当你得到options[i].value时，你会得到一个字符串。在将它们添加到total之前，您应该将它们转换为数字。您只返回总数后转换为数字，然后发生了各种有趣的连接。看看我在上面的片段和jsFiddle中使用parseFloat()的位置。

Answer 2

在此代码中，您永远不会对total执行任何操作，它始终为0。

function getval2(){
var total=0;
var checkboxes = document.forms["orderform"].amen;
for (var i = 0; i < checkboxes.length; i++) {
checkboxes[i].value += total;
}
return total;
}

此外，一个可能帮助您调试这些类型的提示（并使代码更好）的一个提示是尝试使用indentation。

循环不会累计运行的表单值总数

2 个答案: