0

所以，我只能找到如何将信息传递到另一个页面而不是同一页面，这必须完全在客户端完成，没有服务器端工作，因为使用它时将没有互联网连接，因此 mailto 用于表单数据，以便在连接可用时发送。

基本上我有两张表，左边一张有一组标准数字（字段 time1-time8），用户可以根据需要进行更改。这些值合计到“设计小时”字段中。该数字必须输入右侧的“设计小时”字段，以便进行所需的各种计算。在我以前的工作（不是 HTML 或 javascript）中，如果字段名称相同，则传递数据，显然不是这里的情况。

在我把表格放在左边之前，这个表格工作得很好，但现在我需要添加一个总计一个新的“设计小时”值的选项。非常感谢以前帮助过我的人，也非常感谢现在帮助过我的人。我还在学习，但我正在到达那里。

删除了大多数字段的示例代码，因此您可以看到我在做什么（感谢您指出）下面的完整代码方式...

所以左表中的字段名称

time1 - time8这些值被添加到总设计小时数中

和正确的桌子

工资、教师、班级、设计 时间（与左表相同）、成本、许多、atetextfield7、build_cost、buy_cost、build_hours、buy_hours、build_train、buy_train、build_total、buy_total

<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(', ');

以及以下计算：

} else {
    designhours.value = (time1 + time2 + time3 + time4 + time5 + time6 + time7 + time8);
    build_cost.value = (wageval * designhoursval);
    buy_cost.value = (costval * hiddenval);
    build_hours.value = (designhoursval * manyval);
    build_train.value = (classval * hiddenval);
    build_total.value = (wageval * designhoursval * manyval + classval);
    buy_total.value = (costval * manyval);
    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;
}

完整代码如下

HTML

<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">&nbsp;</td>
                    </tr>
                    <tr>
                        <td width="225" height="22">&nbsp;</td>
                        <td width="127" height="22" align="left">&nbsp;</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">&nbsp;</td>
                    </tr>
                </table>
                <p>&nbsp;</p></td>
            <td width="55" valign="bottom">&nbsp;</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>

Javascript

var btn = document.getElementById('calculate');
btn.onclick = function () {
    //get the input values
    var wageval = parseInt(document.getElementById('wage').value) || 0;
    var instructorsval = parseInt(document.getElementById('instructors').value) || 0;
    var classval = parseInt(document.getElementById('class').value) || 0;
    var designhoursval = parseInt(document.getElementById('designhours').value) || 0;
    var costval = parseInt(document.getElementById('cost').value) || 0;
    var manyval = parseInt(document.getElementById('many').value) || 0;
    var hiddenval = parseInt(document.getElementById('hidden').value) || 0;
    var time1val = parseInt(document.getElementById('time1').value) || 0;
    var time2val = parseInt(document.getElementById('time2').value) || 0;
    var time3val = parseInt(document.getElementById('time3').value) || 0;
    var time4val = parseInt(document.getElementById('time4').value) || 0;
    var time5val = parseInt(document.getElementById('time5').value) || 0;
    var time6val = parseInt(document.getElementById('time6').value) || 0;
    var time7val = parseInt(document.getElementById('time7').value) || 0;
    var time8val = parseInt(document.getElementById('time8').value) || 0;
    // get the elements to hold the results
    var build_cost = document.getElementById('build_cost');
    var buy_cost = document.getElementById('buy_cost');
    var build_hours = document.getElementById('build_hours');
    var buy_hours = document.getElementById('buy_hours');
    var build_total = document.getElementById('build_total');
    var build_train = document.getElementById('build_train');
    var buy_total = document.getElementById('buy_total');
    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');
    var designhours = document.getElementById('designhours');
    // create an empty array to hold error messages
    var msg = [];
    // check each input value, and add an error message to the array if it's not a number
    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 (isNaN(classval)) {
        msg.push('Scenario programming class is not a number');
        // the value isn't a number
    }
    if (isNaN(designhoursval)) {
        msg.push('Instruction design hours per scenario is not a number');
        // the value isn't a number
    }
    if (isNaN(costval)) {
        msg.push('Average cost of SimStore scenarios is not a number');
        // the value isn't a number
    }
    if (isNaN(manyval)) {
        msg.push('How many scenarios do you need is not a number');
        // the value isn't a number
    }
    if (isNaN(hiddenval)) {
        msg.push('joe messed up');
        // the value isn't a number
    }
    if (isNaN(time1val)) {
        msg.push('Needs Analysis is not a number');
        // the value isn't a number
    }
    if (isNaN(time2val)) {
        msg.push('Research is not a number');
        // the value isn't a number
    }
    if (isNaN(time3val)) {
        msg.push('Design is not a number');
        // the value isn't a number
    }
    if (isNaN(time4val)) {
        msg.push('Scenario Programming is not a number');
        // the value isn't a number
    }
    if (isNaN(time5val)) {
        msg.push('Support Materials is not a number');
        // the value isn't a number
    }
    if (isNaN(time6val)) {
        msg.push('Validation is not a number');
        // the value isn't a number
    }
    if (isNaN(time7val)) {
        msg.push('Revision is not a number');
        // the value isn't a number
    }
    if (isNaN(time8val)) {
        msg.push('Implementation is not a number');
        // the value isn't a number
    }
    // if the array contains any values, display an error message

    if (msg.length > 0)  {
        build_cost.value = msg.join(', ');
        buy_cost.value = msg.join(', ');
        build_hours.value = msg.join(', ');
        build_train.value = msg.join(', ');
        build_total.value = msg.join(', ');
        buy_total.value = msg.join(', ');
        time1.value = msg.join(', ');
        time2.value = msg.join(', ');
        time3.value = msg.join(', ');
        time4.value = msg.join(', ');
        time5.value = msg.join(', ');
        time6.value = msg.join(', ');
        time7.value = msg.join(', ');
        time8.value = msg.join(', ');
    } else {
        designhours.value = (time1 + time2 + time3 + time4 + time5 + time6 + time7 + time8);
        build_cost.value = (wageval * designhoursval);
        buy_cost.value = (costval * hiddenval);
        build_hours.value = (designhoursval * manyval);
        build_train.value = (classval * hiddenval);
        build_total.value = (wageval * designhoursval * manyval + classval);
        buy_total.value = (costval * manyval);
        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;
    }
};

再次感谢任何人都可以提供的任何指导。我正在努力度过这一切。

4

2 回答 2

1

首先，不知道这些是干什么用的： 

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');

然后，您只有在 timex 中作为 var 的元素。

所以最简单的解决方法是：
designhours.value = time1val + time2val + time3val + time4val + time5val + time6val + time7val + time8val;

代替：
designhours.value = time1 + time2 + time3 + time4 + time5 + time8 + time7 + time8;

看看你哪里出错了？您将对象（输入字段）添加在一起，而不是它们的值（您已经开始使用）。
请注意，输入字段中的数字不是数字而是字符串。
您可能还想用 parseInt 指定一个基数，例如parseInt(val,10);

最后，您可以对代码进行相当多的重构，这确实有点多（但对您提供有用的错误检测很有用）。

看到这个小提琴：http: //jsfiddle.net/4nHvc/1/

更新：经过进一步检查，还有很多错误：为什么在函数末尾设置这些函数局部变量？ 

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);

但是然后..首先获取所有输入值，进行数学运算，然后输出值不是更容易吗？

看到这个小提琴，现在它几乎可以工作了：http: //jsfiddle.net/4nHvc/2/

于 2013-01-15T01:15:55.590 回答
0

更新您的时间值...

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');”来检查。）

于 2013-01-15T01:32:33.513 回答