-1

我需要编写一个 javascript 来通过从表单中获取数据来进行某些计算。我已经编写了脚本并确保所有 id 和变量都是正确的。出于某种原因，我的脚本似乎没有运行。有人可以告诉我我要去哪里错了吗？

这是我的表单动作。

<body>
        <div class="header">
          Financial Calculator
        </div>
        <script type="text/javascript" src="calc.js"></script>
        <div class="calc">
        <form name="calc" method="post" onsubmit="calc()">
        <table align="center">
               <tr>
                   <th></th>
                       <th>Lease Data</th>
                   <th>Purchase Data</th>
                   <th>Purchase Data with Rebate</th>
               </tr>
               <tr>
                   <td>Cost</td>
                   <td><input type="text" name="cost1" placeholder="Please enter in $"></td>
               <td><input type="text" name="cost2" placeholder="Please enter in $"></td>
               <td><input type="text" name="cost3" placeholder="Please enter in $"></td>
               </tr>
               <tr>
                   <td>Downpayment</td>
                   <td><input type="text" name="downpayment1" placeholder="Please enter in $"></td>
                   <td><input type="text" name="downpayment2" placeholder="Please enter in $"></td>
                   <td><input type="text" name="downpayment3" placeholder="Please enter in $"></td>
               </tr>
               <tr>
                   <td>Period</td>
                   <td><input type="text" name="period1" placeholder="Please enter in months"></td>
               <td><input type="text" name="period2" placeholder="Please enter in years"></td>
               <td><input type="text" name="period3" placeholder="Please enter in years"></td>
               </tr>
               <tr>
                   <td>Rebates/Incentives</td>
                   <td></td>
                   <td></td>
                   <td><input type="text" name="rebate" placeholder="Please enter in $"></td>
               </tr>
               <tr>
                   <td>Interest</td>
                   <td></td>
                   <td><input type="text" name="interest1" placeholder="Please enter in %"></td>
                   <td><input type="text" name="interest2" placeholder="Please enter in %"></td>
               </tr>
               <tr>
                   <td>Monthly Payment</td>
                   <td><input type="text" name="monthly_payment1" placeholder="Please enter in $"></td>
                   <td></td>
                   <td></td>
               </tr>
               <tr>
                   <td>Distance Limit</td>
                   <td><input type="text" name="distance_limit" placeholder="Please enter in miles"></td>
               </tr>
               <tr>
                   <td>Extra Miles</td>
                   <td><input type="text" name="extra_miles" placeholder="Please enter in miles"></td>
               </tr>
               <tr>
                   <td>Cost for extra mile</td>
                   <td><input type="text" name="cost_extra" placeholder="Please enter in $"></td>
               </tr>
               <tr>
                   <td></td>
                   <td></td>
                   <td><br><input type="submit" value="Calculate"></td>
               </tr>

        </table>
        <table id="result">
        <tr>
            <th></th>
            <th>Purchase with finance</th>
            <th>Purchase with Rebate</th>
            <th>Lease</th>
            <th>Purchase after Lease</th>
            <th>Purchase after lease with additional miles</th>
        </tr>
<tr>
    <td>Total Monthly Payments</td>
    <td id="mp1"><input type="text"></td>
    <td id="mp2"><input type="text"></td>
    <td id="mp3"><input type="text"></td>
</tr>
<tr>
    <td>Ownership Cost</td>
    <td id="oc1"><input type="text"></td>
    <td id="oc2"><input type="text"></td>
    <td id="oc3"><input type="text"></td>
    <td id="oc4"><input type="text"></td>
    <td id="oc5"><input type="text"></td>
</tr>
<tr>
    <td>Per month owned</td>
    <td id="pmo1"><input type="text"></td>
    <td id="pmo2"><input type="text"></td>
    <td id="pmo3"><input type="text"></td>
    <td id="pmo4"><input type="text"></td>
    <td id="pmo5"><input type="text"></td>
</tr>
<tr>
    <td>Residual Value</td>
    <td id="res1"><input type="text"></td>
    <td id="res2"><input type="text"></td>
</tr>
<tr> <td></td></tr>
<tr><td></td></tr>
<tr> <td></td></tr>
<tr><td></td></tr>
<tr> <td></td></tr>
<tr><td></td></tr>
          </table>
        </form>
        </div>
  </body>

我的 Javascript 是：

function calc() 
{
    var cost1 = (parseFloat)(document.calc.cost1.value);
    var downpayment1  = (parseFloat)(document.calc.downpayment1.value);
    var mp1 = (parseFloat)(document.calc.monthly_payment1.value);
    var period1 = (parseFloat)(document.calc.period1.value);
    var extra_miles = (parseFloat)(document.calc.extra_miles.value);
    var cost_extra_miles = (parseFloat)(document.calc.cost_extra_miles.value);

    var extra_cost = extra_miles * cost_extra_miles;
    var res_amt = 0.56 * cost1;
    var totmp = mp1 * period1; 
    var ocost1 = downpayment1 + totmp + extra_cost;
    var omonth1 = ocost1 / period1;

    var ocost2 = ocost1 + res_amt;
    var omonth2 = ocost2 / period1;

    var ocost3 = ocost2 - extra_cost;
    var omonth3 = ocost3 / period1;


    var cost2 = (parseFloat)(document.calc.cost2.value);
    var downpayment2  = (parseFloat)(document.calc.downpayment2.value);
    var period2 = (parseFloat)(document.calc.period2.value);
    var interest1 = (parseFloat)(document.calc.interest1.value);

    var finance1 = cost2 - downpayment2;
    var mp2 = ((interest1 / 12) * period2) - finance1;
    var omonth_woreb = mp2 * period2;
    var ocost_woreb = omonth_woreb + downpayment2;
    var pmonth_woreb = ocost_woreb / period2;
    var resvalue1 = ocost_woreb - res_amt;


    var cost3 = (parseFloat)(document.calc.cost3.value);
    var downpayment3  = (parseFloat)(document.calc.downpayment3.value);
    var period3 = (parseFloat)(document.calc.period3.value);
    var interest2 = (parseFloat)(document.calc.interest2.value);    
    var rebate = (parseFloat)(document.calc.rebate.value);

    var finance2 = cost3 - downpayment3 -rebate;
    var mp3 = ((interest1 / 12) * period3) - finance2;
    var omonth_wreb = mp3 * period3;
    var ocost_wreb = omonth_wreb + downpayment3;
    var pmonth_wreb = ocost_wreb / period3;
    var resvalue2 = ocost_wreb - res_amt;



document.getElementById("mp1").innerHTML = ; 
document.getElementById("mp2").innerHTML = ;
document.getElementById("mp3").innerHTML = totmp;


document.getElementById("oc1").innerHTML = ocost_woreb; 
document.getElementById("oc2").innerHTML = ocost_wreb;
document.getElementById("oc3").innerHTML = ocost1;
document.getElementById("oc4").innerHTML = ocost2;
document.getElementById("oc5").innerHTML = ocost3;


document.getElementById("pmo1").innerHTML = pmonth_woreb; 
document.getElementById("pmo2").innerHTML = pmonth_wreb;
document.getElementById("pmo3").innerHTML = omonth1;
document.getElementById("pmo4").innerHTML = omonth2;
document.getElementById("pmo5").innerHTML = omonth3;

document.getElementById("res1").innerHTML = resvalue1; 
document.getElementById("res2").innerHTML = resvalue2;

}
4

2 回答 2

1 
var cost1 = (parseFloat)(document.calc.cost1.value);

您不要将 parseFloat 包装在括号中。

var cost1 = parseFloat(document.calc.cost1.value);

而且您没有取消表单提交，页面正在引用。取消提交的简单方法是返回 false

onsubmit="calc();return false;"

这是一个错误

document.getElementById("mp1").innerHTML = ; 
document.getElementById("mp2").innerHTML = ;

看这个：

id 在 td 上，而不是在输入上。如果这是您的计划，您将不会在那里获得价值。

于 2013-10-22T22:34:34.117 回答
1

以下行在语法上无效：

document.getElementById("mp1").innerHTML = ; 
document.getElementById("mp2").innerHTML = ;

如果要清空输入的内容，可以使用value空字符串：

document.getElementById("mp1").value = '';
document.getElementById("mp2").value = '';
于 2013-10-22T22:35:17.263 回答