Javascript 将html格式的字段计算传递给相同格式的另一个字段
因此，我只能找到如何将信息传递到另一个页面，而不是同一个页面，这必须完全在客户端完成，没有服务器端的工作，因为使用时将没有internet连接，因此表单数据的mailto可以在连接可用时发送 基本上我有两个表，左边的一个表有一组标准的数字（字段time1-time8），用户可以根据需要进行更改。这些值合计到“设计小时”字段中。该数字必须输入右侧的“设计小时数”字段中，以便进行所需的各种计算。在我以前的工作（不是HTML或javascript）中，如果字段名相同，则传递数据，这里显然不是这种情况 在我把表格放在左边之前，这个表单工作得很好，但是现在我需要添加一个新的“designhours”值的合计选项。非常感谢以前帮助过我的人，也非常感谢现在帮助过我的人。我还在学习，但我正在努力 示例代码删除了大多数字段，这样您就可以在下面看到我在做什么（感谢您指出）完整的代码 因此，左表中的字段名 时间1-时间8 将这些值相加，以设计小时为单位计算总数 和右表 工资、教员、班级、设计时数（与左表相同）、成本、多、ATETEXTFORD7、建造成本、购买成本、建造时数、购买时数、建造时数、建造时数、建造时数、建造时数、建造时数、建造时数、建造时数、建造时数、建造时数Javascript 将html格式的字段计算传递给相同格式的另一个字段,javascript,html,forms,Javascript,Html,Forms,因此，我只能找到如何将信息传递到另一个页面，而不是同一个页面，这必须完全在客户端完成，没有服务器端的工作，因为使用时将没有internet连接，因此表单数据的mailto可以在连接可用时发送 基本上我有两个表，左边的一个表有一组标准的数字（字段time1-time8），用户可以根据需要进行更改。这些值合计到“设计小时”字段中。该数字必须输入右侧的“设计小时数”字段中，以便进行所需的各种计算。在我以前的工作（不是HTML或javascript）中，如果字段名相同，则传递数据，这里显然不是这种情况
<script type="text/javascript">
var btn = document.getElementById('calculate');
btn.onclick = function() {
var wageval = parseInt(document.getElementById('wage').value) || 0;
var instructorsval = parseInt(document.getElementById('instructors').value) || 0;
var build_cost = document.getElementById('build_cost');
var buy_cost = document.getElementById('buy_cost');
var msg = [];
if (isNaN(wageval)) {
msg.push('Average instructor hourly wage is not a number');
// the value isn't a number
}
if (isNaN(instructorsval)) {
msg.push('Number of instructors per course is not a number');
// the value isn't a number
}
if (msg.length > 0) {
build_cost.value = msg.join(', ');
buy_cost.value = msg.join(', ');
<form id="form1" name="form1" method="post" action="mailto:?subject=Laerdal%20ROI%20Information" enctype="text/plain">
<table width="859" border="0" cellpadding="0" cellspacing="0">
<tr>
<td valign="bottom">
<table width="352" border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="22" colspan="2"> </td>
</tr>
<tr>
<td width="225" height="22"> </td>
<td width="127" height="22" align="left"> </td>
</tr>
<tr>
<td height="22"><span class="norm">Needs Analysis</span></td>
<td height="22" align="center"><input name="time1" type="text" class="field" id="time1" value="1" size="10" /></td>
</tr>
<tr>
<td height="22"><span class="norm">Research</span></td>
<td height="22" align="center"><input name="time2" type="text" class="field" id="time2" value="2" size="10" /></td>
</tr>
<tr>
<td height="22"><span class="norm">Design</span></td>
<td height="22" align="center"><input name="time3" type="text" class="field" id="time3" value="2" size="10" /></td>
</tr>
<tr>
<td height="22"><span class="norm">Scenario Programming</span></td>
<td height="22" align="center"><input name="time4" type="text" class="field" id="time4" value="3" size="10" /></td>
</tr>
<tr>
<td height="22"><span class="norm">Support Materials</span></td>
<td height="22" align="center"><input name="time5" type="text" class="field" id="time5" value="16" size="10" /></td>
</tr>
<tr>
<td height="22"><span class="norm">Validation</span></td>
<td height="22" align="center"><input name="time6" type="text" class="field" id="time6" value="2" size="10" /></td>
</tr>
<tr>
<td height="22"><span class="norm">Revision</span></td>
<td height="22" align="center"><input name="time7" type="text" class="field" id="time7" value="4" size="10" /></td>
</tr>
<tr>
<td height="22"><span class="norm">Implementation</span></td>
<td height="22" align="center"><input name="time8" type="text" class="field" id="time8" value="2" size="10" /></td>
</tr>
<tr>
<td height="22"><span class="norm">Total</span></td>
<td height="22" align="center"><input name="designhours" class="field" type="text" id="designhours" size="10" /></td>
</tr>
<tr>
<td height="73" colspan="2"> </td>
</tr>
</table>
<p> </p></td>
<td width="55" valign="bottom"> </td>
<td>
<table width="440" border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="36" colspan="2" align="right" class="norm">Average Instructor hourly wage:</td>
<td height="36" align="right"><input name="wage" class="field" type="text" id="wage" size="12" /></td>
</tr>
<tr>
<td height="36" colspan="2" align="right" class="norm">Number of Instructors per course:</td>
<td height="36" align="right"><input name="instructors" class="field" type="text" id="instructors" size="12" /></td>
</tr>
<tr>
<td height="36" colspan="2" align="right" class="norm">Scenario Programing Class:</td>
<td height="36" align="right"><input name="class" class="field" type="text" id="class" size="12" /></td>
</tr>
<tr>
<td height="36" colspan="2" align="right" class="norm">Instruction design hours per scenarios:</td>
<td height="36" align="right"><input name="designhours" class="field" type="text" readonly="true" id="designhours" size="12" /></td>
</tr>
<tr>
<td height="36" colspan="2" align="right" class="norm">Average cost of SimStore Scenarios:</td>
<td height="36" align="right"><input name="cost" class="field" type="text" id="cost" value="295" size="12" /></td>
</tr>
<tr>
<td height="36" colspan="2" align="right" class="norm">How many scenarios do you need:</td>
<td height="36" align="right"><input name="many" class="field" type="text" id="many" size="12" /></td>
</tr>
<tr>
<td height="36" colspan="2" align="right" class="norm">Date needed?:</td>
<td height="36" align="right"><input name="atetextfield7" class="field" type="text" id="atetextfield7" size="12" /></td>
</tr>
<tr>
<td height="40" colspan="3" align="center" class="calc">CALCULATED RESULTS</td>
</tr>
<tr>
<td height="40"><input name="hidden" type="hidden" id="hidden" value="1" /></td>
<td height="40" align="center" class="bold">BUILD</td>
<td height="40" align="center" class="bold">BUY</td>
</tr>
<tr>
<td height="38" align="right" class="norm">Cost per scenario:<img src="images/Blank.png" alt="" width="12" height="5" /></td>
<td height="38" align="center"><input name="build_cost" class="field" type="text" id="build_cost" size="12" /></td>
<td height="38" align="center"><input name="buy_cost" class="field" type="text" id="buy_cost" size="12" /></td>
</tr>
<tr>
<td height="38" align="right" class="norm">Total development hours:<img src="images/Blank.png" alt="" width="12" height="5" /></td>
<td height="38" align="center"><input name="build_hours" class="field" type="text" id="build_hours" size="12" /></td>
<td height="38" align="center"><input name="buy_hours" class="field" type="text" id="buy_hours" value="0" size="12" /></td>
</tr>
<tr>
<td height="38" align="right" class="norm">
Scenario Programming<img src="images/Blank.png" alt="" width="12" height="5" /><br />
Training (8h):<img src="Blank.png" alt="" width="12" height="5" />
</td>
<td height="38" align="center"><input name="build_train" class="field" type="text" id="build_train" size="12" /></td>
<td height="38" align="center"><input name="buy_train" class="field" type="text" id="buy_train" value="0" size="12" /></td>
</tr>
<tr>
<td height="38" align="right" class="norm">Total Cost:<img src="images/Blank.png" alt="" width="12" height="5" /></td>
<td height="38" align="center"><input name="build_total" class="field" type="text" id="build_total" size="12" /></td>
<td height="38" align="center"><input name="buy_total" class="field" type="text" id="buy_total" size="12" /></td>
</tr>
<tr>
<td height="50" colspan="3" align="center" valign="bottom"><input type="reset" />
<img src="images/Blank.png" alt="" width="15" height="25" />
<input name="calculate" type="button" id="calculate" value="Calculate" />
<img src="images/Blank.png" alt="" width="15" height="25" />
<input name="share" type="submit" id="submit" value="Share" />
</td>
</tr>
</table>
</td>
</tr>
</table>
</form>
再次感谢任何人给予的指导。我正在努力克服这一切。首先，我不知道这些是为了什么：
var time1 = document.getElementById('time1');
var time2 = document.getElementById('time1');
var time3 = document.getElementById('time1');
var time4 = document.getElementById('time1');
var time5 = document.getElementById('time1');
var time6 = document.getElementById('time1');
var time7 = document.getElementById('time1');
var time8 = document.getElementById('time1');
designhours.value=time1val+time2val+time3val+time4val+time5val+time6val+time7val+time8val
而不是：
designhours.value=time1+time2+time3+time4+time5+time8+time7+time8
看你哪里出错了？您正在将对象（输入字段）添加到一起，而不是它们的值（您已经开始了）。
请注意，输入字段中的数字不是数字而是字符串。
您可能还希望使用parseInt指定一个基数，如parseInt（val，10）
最后，您可以重新考虑代码，这确实有点太多了（但在提供有用的错误检测方面对ya很好）
看这把小提琴：
更新：进一步检查后，发现更多错误：
为什么这些函数局部变量设置在函数的末尾
var build_costval = parseInt(build_cost.value) || 0;
var buy_costval = parseInt(buy_cost.value) || 0;
var build_hoursval = parseInt(build_hours.value) || 0;
var build_trainval = parseInt(build_train.value) || 0;
var build_totalval = parseInt(build_total.value) || 0;
var buy_totalval = parseInt(buy_total.value) || 0;
var designhoursval = parseInt(designhours.value) || 0;
在第一行之后的下一行javascript使用了错误的变量名（因此添加对象而不是它们的值），也无法工作：
build_cost.value=（wageval*designhoursval）
好的，如果在代码的开头得到inputfield designhoursval的值，那么该字段仍然是空的。。那么，当脚本执行上述行时，什么是designhoursval
？？？对，空的。例如，如果您使用最后一块“无用”代码重新读取该值，而不使用var
变量声明（您已在函数开头声明了该值），并将其放在该行上方，则计算器的另一个字段开始工作：
designhoursval = parseInt(designhours.value) || 0;
build_cost.value = (wageval * designhoursval);
但是。。首先获取所有输入值，进行计算，然后输出值不是更容易吗
看看这把小提琴，现在它几乎可以工作了：更新你的时间值
var time1 = parseInt(document.getElementById('time1').value);
var time2 = parseInt(document.getElementById('time1').value);
var time3 = parseInt(document.getElementById('time1').value);
var time4 = parseInt(document.getElementById('time1').value);
var time5 = parseInt(document.getElementById('time1').value);
var time6 = parseInt(document.getElementById('time1').value);
var time7 = parseInt(document.getElementById('time1').value);
var time8 = parseInt(document.getElementById('time1').value);
另外，我不确定你是如何将你的按钮连接到脚本的，所以我改变了你的功能
function doThis() {
还有你的按钮
<input name="calculate" type="button" id="calculate" value="Calculate" onclick="doThis()" />
这些可能在您的代码中很好，但在您的帖子中忽略了这一部分，所以请查看。（您可以使用“alert（'foo'）；”来检查。）这是一大堆代码。你能提供一个小的例子来说明你需要什么吗？代码已经足够好了，在这种情况下，它可以让我们理解他没有什么，这有助于我们教我钓鱼。你应该查阅CSS指南-它会让你的HTML更可读和可编辑。我的答案有了很大的更新，这段代码的错误比第一眼看到的要多。我昨天在网上见过你，你找到并解决了你的问题了吗？一切就绪，谢谢。我最大的缺陷是添加字段，而不是您指出的值。它很管用，可能不优雅。但目前它做了它需要做的。我想我还要多上几次W3学校的课。别把W3学校当回事！请看：我真正最好的建议是看一些Douglas Crockford的视频，如果你真的想学习和理解javascript的绝对简单性：学习它新鲜，不要将它与基于类的语言进行比较！如果我的答案解决了你的问题，请不要忘记接受它！感谢您所做的一切，我将看一看Crockford。您提到的任何事情都没有错（他的问题的实际原因）或遗漏在随提问者问题提供的代码中：阅读我的答案。
function doThis() {
<input name="calculate" type="button" id="calculate" value="Calculate" onclick="doThis()" />