使用 Javascript 计算表单字段——结果是 NaN

Question

我创建了一个简短的表单，它应该根据用户输入来计算值。我已经弄清楚了大部分，但似乎无法让结果显示在总计字段中。相反，我得到的是 NaN。

我正在尝试使用 parseInt，但还没有运气。

这是我目前所拥有的：

Javascript：

 var AdPrice = document.getElementsByTagName('input') = 0;
  var ColorCharge = document.getElementsByTagName('input') = 0;
  var WebAd = document.getElementsByTagName('input') = 0;
  var AdSubtotal = 0;
  var DownPayment = document.getElementsByTagName('input') = 0;
  var TotalPrice = 0;
  var Payments = document.getElementsByTagName('input') = 0;
  var TotalPayment = 0; 

function updateTotal()
{
  var subtotal = AdPrice + ColorCharge + WebAd;
  var total = subtotal - DownPayment;
  var totalmonthlypayment = total / Payments;

 parseFloat(document.getElementById('AdSubtotal').value = subtotal);
 parseFloat(document.getElementById('TotalPrice').value = total);
 parseFloat(document.getElementById('Payment').value = totalmonthlypayment);


}

HTML：

<fieldset>
              <legend>Payment Details</legend>

             Ad Charge $

              <input type="text" name="AdPrice" id="AdPrice" class="medium" onChange="updateTotal()" /><br />

              Color Charge +

              <input type="text" name="ColorCharge" id="ColorCharge" class="medium" onChange="updateTotal()" /><br />

              Web Ad +
              <input type="text" name="WebAd" id="WebAd" class="medium" onChange="updateTotal()" /><br />

              Subtotal =

              <input type="text" name="AdSubtotal" id="AdSubtotal" readonly class="medium"  /><br />

           Down Payment -

           <input type="text" name="DownPayment" id="DownPayment" class="medium" onChange="updateTotal()" /><br />

           Total = 
           <input type="text" name="TotalPrice" id="TotalPrice" readonly class="medium"  /><br /><br />



           # Consec. Payments \

             <input type="text" name="Payments" id="Payments" class="medium" onChange="updateTotal" /><br />

            Amt Each Payment $ 

            <input type="text" name="Payment" id="Payment" class="medium" readonly  /><br /><br />

            <input type="checkbox" name="ProratedCheck" id="ProratedCheck" /> <span style="margin-right:10px;">Prorated/Length</span><input type="text" name="ProratedLength" id="ProratedLength" />
</fieldset>           

我还有一把小提琴：

http://jsfiddle.net/kjetterman/eHQV4/10/

Answer 1

在开头除以零（小计）。

并且： 这种绑定有效吗？我想不是。对我来说很新......

在方法中放置“getElements”行怎么样？

Answer 2

您需要处理的 javascript 上有几个错误，正如您的问题的 cmets 所述，您应该使用 getElementById 检索 DOM 元素，您遇到的另一个问题是您的代码在浏览器得到的响应目前可能没有 DOM 准备好工作，因此您的所有引用都返回为 NULL。这是工作版本，您仍然需要为初始值为零时添加一些验证，这样您就不会得到 NaN 作为操作的结果。

http://jsfiddle.net/Wy7kE/2/