Использование Javascript для вычисления полей формы - получить NaN в результате

Я создал короткую форму, которая должна рассчитывать значения на основе пользовательского ввода. Я понял большую часть этого, но не могу получить результаты, которые будут отображаться в поле итогов. Вместо этого я получаю 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/

Источник

2 ответа

Решение

В javascript было несколько ошибок, над которыми вам нужно поработать, как указано в комментариях к вашему вопросу, которые вы должны использовать getElementById для извлечения элементов DOM другая проблема, с которой вы столкнулись, заключается в том, что ваш код был запущен, как только браузер получит ответ, который в данный момент может не иметь DOM, готового к работе, поэтому все ваши ссылки возвращаются как NULL. Вот рабочая версия, вам все еще нужно добавить некоторую проверку, когда начальные значения равны нулю, чтобы вы не получили NaN в результате операций.

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

Источник

Деление на ноль (промежуточный итог) в начале.

И: Работает ли этот вид связывания? Думаю, нет. Очень новый для меня.......

Как насчет размещения строк метода getElements внутри метода?

Источник
Другие вопросы по тегам