Javascript多功能无法正常工作

时间:2013-11-29 09:20:02

标签: javascript html

我使用三个javascript函数来输入字段值的总和。但前两个功能运行良好,但第三个功能不起作用。

这是我的javascripts:

 <script language="javascript">
                function addNumbers()
                {
                        var val1 = parseInt(document.getElementById("ot").value);
                        var val2 = parseInt(40);
                        var ansD = document.getElementById("totalot");
                        ansD.value = val1 * val2;
                }
                function addSecincome(){
                        var val1 = parseInt(document.getElementById("totalot").value);
                        var val2 = parseInt(document.getElementById("mc").value);
                        var val3 = parseInt("1024");
                        var ansD = document.getElementById("secincome");
                        ansD.value = val3 * val1 + val2;

                }
                function addIncome(){
                     var val1 = parseInt(document.form.getElementById("totalot").value);
                        var val2 = parseInt("150");                       
                        var ansD = document.form.getElementById("INC");
                        ansD.value = val2 * val1 ;                
                }

        </script>

Here is my html codes:
  <tr height="20">
    <td height="20">BUYER</td>
    <td colspan="3"><input type="text" name="buyer" value=" " /></td>
    <td>OT</td>
    <td><input id="ot" type="text" name="ot" value="" /></td>
    <td><input type="text" id="totalot"  name="totalot" onclick="javascript:addNumbers()" value="" /></td>
    <td>MC</td>
    <td><input id="mc" type="text" name="mc" value=""  /></td>
    <td colspan="2"><input id="secincome" type="text"  onclick="javascript:addSecincome()" name="2ndincome" value="" /></td>
    <td>SMV</td>
    <td><input type="text" name="smv" value= "  " /></td>
    <td>O/QTY</td>
    <td><input type="text" name="oqyt" value=" " /></td>
    <td>TTL AVG</td>
    <td><input type="text" name="planeffi" value=" " /></td>
  </tr>

  <tr height="20">
    <td height="20">DAY INPUT</td>
    <td colspan="3"><input type="text" name="dayinput" value=" " /></td>
    <td colspan="2">PLAN HOUR</td>
    <td> <input type="text" name="planhour" vaue="10" /></td>
    <td colspan="2">PRO/LOSS</td>
    <td colspan="2"><input id="ploss" type="text" onclick="javascript:pp();" name="proloss" value="" /></td>
    <td>TGT</td>
    <td>T/TGT</td>
    <td>CUTTING</td>
    <td><input type="text" name="cutting" value=" " /></td>
    <td rowspan="2"><input type="text" name="ttlavg" value=" " /></td>
    <td>&nbsp;</td>
  </tr>

虽然函数syntex是相同的,但第三个函数对我不起作用。我尝试过不同的输入ID,但它对我不起作用。但前两个功能正在发挥作用。我不明白这个问题,我以前没有这个问题。

需要你的帮助谢谢。

2 个答案:

答案 0 :(得分:1)

document.form.getElementById("totalot");更改为document.getElementById("totalot");

function addIncome() {
    var val1 = parseInt(document.getElementById("totalot").value); //Removed .form here
    var val2 = parseInt("150");                       
    var ansD = document.form.getElementById("INC"); //Removed .form here too
    ansD.value = val2 * val1 ;                
}

我也刚刚意识到您的HTML代码并未在任何地方引用您的addIncome()函数?您需要将其附加到HTML中的事件。您的其他两个函数运行输入框的onclick

<input id="secincome" type="text"  onclick="javascript:addSecincome()" name="2ndincome" value="" />

我建议将onclick更改为onchange。然后你需要在右边的文本框中添加以下行onchange="addIncome()"来运行不起作用的函数。

同样val2 = parseInt("150") - 你创建一个字符串并将其更改为数字是没有意义的吗? - 只需在val2 = 150周围省略""引号即可写出ansD.value = 150 * val1;。甚至更简单{{1}}。无需将150分配给变量

我是否还建议通过将parameters传递给函数然后重复使用来创建一个可重用的函数,从而使代码更具动态性。

答案 1 :(得分:0)

试试吧!

function addIncome() {
    var val1 = parseInt(document.getElementById("totalot").value);
    var val2 = parseInt("150");                       
    var ansD = document.form.getElementById("INC");
    ansD.value = val2 * val1 ;                
}