好的，所以我是一个初学者（一天前开始了这段旅程），慢慢地自学了 javascript，我为一个简单的报价器编写了一个代码......但现在我试图在它的基础上进行构建。我知道代码的格式真的很糟糕（我不知道空格应该去哪里以及那些括号：S）但是我想出的工作......间距和东西对程序很重要吗？或者是出于美学原因和易于调试等...
所以我的报价......它有一些关于总价格、时间、镜头和 DVD 的方程......它们都是输入字段，现在我想在方程中添加复选框......如果它们被选中一个值将被添加到总数中...我将它们放在计算器中，但没有附加脚本...只有三个复选框具有设定值 ...2 个复选框将具有乘以 dvd 数量的值在被添加到总数之前......最后一个复选框将是另一个类似于我已经拥有的文本输入......
我尝试了很多东西，比如另一个函数，但它可能还是做错了大声笑，我尝试了另一个计算函数、加法函数、updatecost 函数、一些 chkbox 函数（我忘记了名字）......但我不知道如何得到计算的值在该复选框的函数中，进入计算函数的方程。我尝试了 parsefloat 的东西，如果我检查了值，它只会半工作......
我尝试的另一件事是在输入复选框的值之前放置一个输入隐藏值 0，两者都具有相同的名称...一些研究告诉我，如果未选中该复选框，它将默认为我设置的隐藏值相同的名称（即 0）...它不起作用...或者我可能没有在等式中输入它...请指导我正确的方向 :) 我正要拔掉我的头发！！！
http://jsfiddle.net/yetanothercoder/uFD3y/
<html>
<head>
<style type="text/css">
.tableheader {
font-weight: bold;
font-size: 20px;
font-family: calibri;
text-align: center;
}
.regreelfont {
font-size: 15px;
font-family: calibri;
text-align: right;
background-color: #96C6FF;
}
.supreelfont {
font-size: 15px;
font-family: calibri;
text-align: right;
background-color: #7CB8FF;
}
.sixreelfont {
font-size: 15px;
font-family: calibri;
text-align: right;
background-color: #55A1FE;
}
.bottomfonts {
font-family: calibri;
font-size: 16px;
font-weight: 900;
}
.cellcolor {
text-align: center;
background-color: #D2E7FF;
}
.cellcolor2 {
text-align: left;
background-color: #D2E7FF;
}
.rightside {
background-color: #D2E7FF;
text-align: right;
}
.border {
border-width: 10px;
border-radius: 20px;
border-style: solid;
border-color: #CBCBCB;
}
.leftside {
text-align: left;
}
.bottwo {
border-bottom-right-radius: 10px;
border-bottom-left-radius: 10px;
}
.addons {
font-family: Lucida Console;
font-size:11px;
font-weight;
bold;
}
.topleft {
border-top-left-radius: 10px;
}
.topright {
border-top-right-radius: 10px;
}
.orange {
color: #fef4e9;
border: solid 1px ##197BFB;
border-radius: 10px;
background: #f78d1d;
background: -webkit-gradient(linear, left top, left bottom, from(#197BFB), to(#4A5C75));
background: -moz-linear-gradient(top, #197BFB, #207DF6);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#197BFB', endColorstr='#4A5C75');
}
.orange:hover {
background: #C3D9FF;
}
.orange:active {
color: #000000;
</style>
<script language="javascript" type="text/javascript">
function calculate() {
var type;
price = parseFloat(0.20);
regthree = parseFloat(document.form.regthree.value);
if (isNaN(regthree)) {
regthree = 0;
}
regfour = parseFloat(document.form.regfour.value);
if (isNaN(regfour)) {
regfour = 0;
}
regfive = parseFloat(document.form.regfive.value);
if (isNaN(regfive)) {
regfive = 0;
}
regsix = parseFloat(document.form.regsix.value);
if (isNaN(regsix)) {
regsix = 0;
}
regseven = parseFloat(document.form.regseven.value);
if (isNaN(regseven)) {
regseven = 0;
}
supthree = parseFloat(document.form.supthree.value);
if (isNaN(supthree)) {
supthree = 0;
}
supfour = parseFloat(document.form.supfour.value);
if (isNaN(supfour)) {
supfour = 0;
}
supfive = parseFloat(document.form.supfive.value);
if (isNaN(supfive)) {
supfive = 0;
}
supsix = parseFloat(document.form.supsix.value);
if (isNaN(supsix)) {
supsix = 0;
}
supseven = parseFloat(document.form.supseven.value);
if (isNaN(supseven)) {
supseven = 0;
}
sixthree = parseFloat(document.form.sixthree.value);
if (isNaN(sixthree)) {
sixthree = 0;
}
sixfour = parseFloat(document.form.sixfour.value);
if (isNaN(sixfour)) {
sixfour = 0;
}
sixfive = parseFloat(document.form.sixfive.value);
if (isNaN(sixfive)) {
sixfive = 0;
}
sixsix = parseFloat(document.form.sixsix.value);
if (isNaN(sixsix)) {
sixsix = 0;
}
sixseven = parseFloat(document.form.sixseven.value);
if (isNaN(sixseven)) {
sixseven = 0;
}
regthreetot = parseFloat(regthree * 50);
regfourtot = parseFloat(regfour * 100);
regfivetot = parseFloat(regfive * 200);
regsixtot = parseFloat(regsix * 300);
regseventot = parseFloat(regseven * 400);
supthreetot = parseFloat(supthree * 50);
supfourtot = parseFloat(supfour * 100);
supfivetot = parseFloat(supfive * 200);
supsixtot = parseFloat(supsix * 300);
supseventot = parseFloat(supseven * 400);
sixthreetot = parseFloat(sixthree * 50);
sixfourtot = parseFloat(sixfour * 100);
sixfivetot = parseFloat(sixfive * 200);
sixsixtot = parseFloat(sixsix * 300);
sixseventot = parseFloat(sixseven * 400);
rthreet = parseFloat(regthree * 3.5);
if (isNaN(regthree)) {
regthree = 0;
}
rfourt = parseFloat(regfour * 7);;
if (isNaN(regfour)) {
regfour = 0;
}
rfivet = parseFloat(regfive * 14);
if (isNaN(regfive)) {
regfive = 0;
}
rsixt = parseFloat(regsix * 22);
if (isNaN(regsix)) {
regsix = 0;
}
rsevent = parseFloat(regseven * 29);
if (isNaN(regseven)) {
regseven = 0;
}
sthreet = parseFloat(supthree * 3);
if (isNaN(supthree)) {
supthree = 0;
}
sfourt = parseFloat(supfour * 6);
if (isNaN(supfour)) {
supfour = 0;
}
sfivet = parseFloat(supfive * 13);
if (isNaN(supfive)) {
supfive = 0;
}
ssixt = parseFloat(supsix * 20);
if (isNaN(supsix)) {
supsix = 0;
}
ssevent = parseFloat(supseven * 26);
if (isNaN(supseven)) {
supseven = 0;
}
sithreet = parseFloat(sixthree * 1.5);
if (isNaN(sixthree)) {
sixthree = 0;
}
sifourt = parseFloat(sixfour * 3);
if (isNaN(sixfour)) {
sixfour = 0;
}
sifivet = parseFloat(sixfive * 7);
if (isNaN(sixfive)) {
sixfive = 0;
}
sisixt = parseFloat(sixsix * 11);
if (isNaN(sixsix)) {
sixsix = 0;
}
sisevent = parseFloat(sixseven * 14);
if (isNaN(sixseven)) {
sixseven = 0;
}
totalprice = parseFloat(regthreetot + regfourtot + regfivetot + regsixtot + regseventot + supthreetot + supfourtot + supfivetot + supsixtot + supseventot + sixthreetot + sixfourtot + sixfivetot + sixsixtot + sixseventot) * price;
tottime = parseFloat(rthreet + rfourt + rfivet + rsixt + rsevent + sthreet + sfourt + sfivet + ssixt + ssevent + sithreet + sifourt + sifivet + sisixt + sisevent)
totalfoot = parseFloat(regthreetot + regfourtot + regfivetot + regsixtot + regseventot + supthreetot + supfourtot + supfivetot + supsixtot + supseventot + sixthreetot + sixfourtot + sixfivetot + sixsixtot + sixseventot)
dvdcal = parseFloat(tottime / 60)
totdvd = Math.ceil(dvdcal)
document.form.quote.value = totalprice;
document.form.totalfootage.value = totalfoot;
document.form.ttime.value = tottime;
document.form.totdvd.value = totdvd;
document.form.totad.value = music
}
</script>
</head>
<body>
<form name="form">
<table class="border" cellspacing="0" cellpadding="3">
<tr>
<td class="tableheader cellcolor topleft">Reel Size</td>
<td class="tableheader cellcolor topright"># of Reels</td>
</tr>
<tr>
<td class="regreelfont">3" Regular8 (50 ft)</font>
</td>
<td class="cellcolor">
<input type="text" name="regthree" style="font-family:Verdana; background-color:#FFFFE5; text-align:center; height:30px; width:60px; font-size:21px">
</td>
</tr>
<tr>
<td class="regreelfont">4" Regular8 (100 ft)</td>
<td class="cellcolor">
<input type="text" name="regfour" style="font-family:Verdana; background-color:#FFFFE5; text-align:center; height:30px; width:60px; font-size:21px">
</td>
</tr>
<tr>
<td class="regreelfont">5" Regular8 (200 ft)</td>
<td class="cellcolor">
<input type="text" name="regfive" style="font-family:Verdana; background-color:#FFFFE5; text-align:center; height:30px; width:60px; font-size:21px">
</td>
</tr>
<tr>
<td class="regreelfont">6" Regular8 (300 ft)</td>
<td class="cellcolor">
<input type="text" name="regsix" style="font-family:Verdana; background-color:#FFFFE5; text-align:center; height:30px; width:60px; font-size:21px">
</td>
</tr>
<tr>
<td class="regreelfont">7" Regular8 (400 ft)</td>
<td class="cellcolor">
<input type="text" name="regseven" style="font-family:Verdana; background-color:#FFFFE5; text-align:center; height:30px; width:60px; font-size:21px">
</td>
<tr></tr>
<td class="supreelfont">3" Super8 (50 ft)</td>
<td class="cellcolor">
<input type="text" name="supthree" style="font-family:Verdana; background-color:#FFFFE5; text-align:center; height:30px; width:60px; font-size:21px">
</td>
</tr>
<tr>
<td class="supreelfont">4" Super8 (100 ft)</td>
<td class="cellcolor">
<input type="text" name="supfour" style="font-family:Verdana; background-color:#FFFFE5; text-align:center; height:30px; width:60px; font-size:21px">
</td>
</tr>
<tr>
<td class="supreelfont">5" Super8 (200 ft)</td>
<td class="cellcolor">
<input type="text" name="supfive" style="font-family:Verdana; background-color:#FFFFE5; text-align:center; height:30px; width:60px; font-size:21px">
</td>
</tr>
<tr>
<td class="supreelfont">6" Super8 (300 ft)</td>
<td class="cellcolor">
<input type="text" name="supsix" style="font-family:Verdana; background-color:#FFFFE5; text-align:center; height:30px; width:60px; font-size:21px">
</td>
</tr>
<tr>
<td class="supreelfont">7" Super8 (400 ft)</td>
<td class="cellcolor">
<input type="text" name="supseven" style="font-family:Verdana; background-color:#FFFFE5; text-align:center; height:30px; width:60px; font-size:21px">
</td>
</tr>
<tr>
<td class="sixreelfont">3" 16mm (50 ft)</td>
<td class="cellcolor">
<input type="text" name="sixthree" style="font-family:Verdana; background-color:#FFFFE5; text-align:center; height:30px; width:60px; font-size:21px">
</td>
</tr>
<tr>
<td td class="sixreelfont">4" 16mm (100 ft)</td>
<td class="cellcolor">
<input type="text" name="sixfour" style="font-family:Verdana; background-color:#FFFFE5; text-align:center; height:30px; width:60px; font-size:21px">
</td>
</tr>
<tr>
<td td class="sixreelfont">5" 16mm (200 ft)</td>
<td class="cellcolor">
<input type="text" name="sixfive" style="font-family:Verdana; background-color:#FFFFE5; text-align:center; height:30px; width:60px; font-size:21px">
</td>
</tr>
<tr>
<td td class="sixreelfont">6" 16mm (300 ft)</td>
<td class="cellcolor">
<input type="text" name="sixsix" style="font-family:Verdana; background-color:#FFFFE5; text-align:center; height:30px; width:60px; font-size:21px">
</td>
</tr>
<tr>
<td td class="sixreelfont">7" 16mm (400 ft)</td>
<td class="cellcolor">
<input type="text" name="sixseven" style="font-family:Verdana; background-color:#FFFFE5; text-align:center; height:30px; width:60px; font-size:21px">
</td>
</tr>
<tr>
<td class="cellcolor addons leftside" colspan="2">BACKGROUND MUSIC - $14.99
<input type="checkbox" name="ckBox" id="ckBox">
</td>
</tr>
<tr>
<td class="cellcolor addons leftside" colspan="2">TITLES (PER DVD) - $9.99
<input type="checkbox" name="titles">
</td>
</tr>
<tr>
<td class="cellcolor addons leftside" colspan="2">TRANSITIONS (PER DVD) - $9.99
<input type="checkbox" name="transitions"
</td>
</tr>
<tr>
<td class="cellcolor addons leftside" colspan="2">FILM REPAIR AND SPLICING - $14.99
<input type="checkbox" name="adees" value="14.99">
</td>
</tr>
<tr>
<td class="cellcolor addons leftside" colspan="2">SPECIAL FILM EDITING - $100.00
<input type="checkbox" name="adees" value="100">
</td>
</tr>
<tr>
<td class="cellcolor addons leftside" colspan="2">EXTRA COPIES - $9.99 PER COPY
<input type="text" name="copies" style="font-family:Verdana; background-color:#FFFFE5; text-align:center; height:25px; width:50px; font-size:15px">
</td>
</tr>
<tr>
<td class="cellcolor" colspan="2"></td>
</tr>
<tr>
<td class="rightside bottomfonts" colspan="2">TOTAL PRICE ($)
<input type="text" name="quote" style="font-family:Verdana; background-color:#FFFFE5; height:25px; text-align:center; width:100px; font-size:16px">
</td>
<tr/>
<tr>
<td class="rightside bottomfonts" colspan="2">FOOTAGE (ft)
<input type="text" name="totalfootage" size="7" style="font-family:Verdana; background-color:#FFFFE5; text-align:center; height:25px; width:100px; font-size:16px"
</td>
</tr>
<tr>
<td class="rightside bottomfonts" colspan="2">TOTAL TIME (min)
<input type="text" name="ttime" size="7" style="font-family:Verdana; background-color:#FFFFE5; text-align:center; height:25px; width:100px; font-size:16px">
</td>
</tr>
<tr>
<td class="rightside bottomfonts" colspan="2">TOTAL DVDs
<input type="text" name="totdvd" size="7" style="font-family:Verdana; background-color:#FFFFE5; text-align:center; height:25px; width:100px; font-size:16px">
</td>
</tr>
<tr>
<td class="cellcolor bottwo" colspan="2">
<input type="button" class="orange" style="font-size: 18px; width:60px;height:35px"
value="Clear" onClick="this.form.reset()"> 
<input type="button" name="Button" class="orange" style="font-size: 18px; width:120px;height:35px"
value="Calculate" onClick="calculate()">
</td>
</tr>
</table>
</form>
</body>