Программа калькулятора JavaScript

-3

Так что я пытаюсь сделать калькулятор для своей работы. В принципе, можно рассчитывать на чьи-то сбережения, если они пришли с нашей фирмой. У меня 3 рабочих раздела, но когда я пытаюсь добавить другое, это не работает. Я опубликую рабочий раздел, а затем раздел, который не работает.Программа калькулятора JavaScript

РАБОЧАЯ:

<div id="VISABOX"> 
<h4 id="VISA">Visa</h4> 
<input id="vVol" placeholder="Visa Volume..." type="text"><br> 
<input id="vFees" placeholder="Visa Fees..." type="text"><br> 

<button id="vCalc"> Calculate </button> 
<p id="vEMDR" class="words">EMDR=<span id="vEMDRSPAN"></span></p> 
<p id="vMonthly" class="words">Monthly Savings=<span id="vMonthlySpan"></span></p> 
<p id="vYearly" class="words">Yearly Savings=<span id="vYearlySpan"> </span></p> 
<p id="vFive" class="words">Five Year Savings=<span id="vFiveSpan"> </span></p> 
</div> 

document.getElementById("vCalc").onclick=function(){ 

     var visaVol=document.getElementById("vVol").value; 
     var visaFees=document.getElementById("vFees").value; 
     var visaEMDR; 
     visaEMDR=visaFees/visaVol*100; 

     var visaMonthly=visaFees-(visaVol*.0171); 
     var visaYearly=visaMonthly*12; 
     var visaFive=visaYearly*5; 

     document.getElementById("vMonthlySpan").innerHTML=" "+visaMonthly+"$"; 
     document.getElementById("vYearlySpan").innerHTML=" "+visaYearly+"$"; 
     document.getElementById("vFiveSpan").innerHTML=" "+visaFive+"$"; 
     document.getElementById("vEMDRSPAN").innerHTML=" "+visaEMDR+"%"; 

    }

не работает (также останавливает другие кнопки работать тоже):

<div id="OCBOX"> 
<h4 id="OCTitle">Other Charges</h4> 
<input id="otherCharges" placeholder="Total Other Charges..." type="text"><br> 
<input id="ourCharges" placeholder="Our Charges..." type="text"><br> 

<button id="ocCalc"> Calculate </button> 
<p id="ocMonthly" class="words">Monthly Savings=<span id="ocMonthlySpan"></span></p> 
<p id="ocYearly" class="words">Yearly Savings=<span id="ocYearlySpan"></span></p> 
<p id="ocFive" class="words">Five Year Savings=<span id="ovFiveSpan"> </span></p> 
</div> 

document.getElementById("ocCalc").onclick=function(){ 

    var otherFees=document.getElementById("otherCharges").value; 
    var ourFees=document.getElementById("ourCharges").value; 

    var ocMonthlySav=otherFees-ourFees; 
    var ocYearlySav=ocMonthlySav*12; 
    var ocFiveSav=ocYearlySav*5; 

    document.getElementById("ocMonthlySpan").innerHTML=" "+ocMonthlySav+"$"; 
    document.getElementById("ocYearlySpan").innerHTML=" "+ocYearlySav+"$"; 
    document.getElementById("ocFiveSpan").innerHTML=" "+ocFiveSav+"$"; 

}

Я понятия не имею, что происходит ... любая помощь будет принята с благодарностью.

Редактировать: JavaScript находится в правильных тегах, я просто не помещал их в сообщение.

источник

2016-04-07 Sarah McDonald

Любая ошибка в 'console'? Завернули ли это в тег 'script'? – Rayon

Также помните, что '.value' всегда является строкой. –

Извините, я отредактировал его, чтобы поместить его в правильный тег скрипта. это только когда я добавляю вторую часть, что все это перестает работать. У меня есть 3 одинаковых раздела, в которых есть входы и кнопки, которые все работают. только этот, кажется, разбивает его. –

Там опечатка в этой строке:

<p id="ocFive" class="words">Five Year Savings=<span id="ovFiveSpan"> </span></p>         <!-- =====oc not ov======^-->

о с FiveSpan не о об FiveSpan

Кроме того, очень важно, чтобы обернуть JavaScript в <script> тега.

Отрывок

<!doctype html> 
 
<html> 
 

 
<head> 
 
    <meta charset="utf-8"> 
 
    <title>WorxNo</title> 
 
</head> 
 

 
<body> 
 
    <div id="OCBOX"> 
 
    <h4 id="OCTitle">Other Charges</h4> 
 
    <input id="otherCharges" placeholder="Total Other Charges..." type="text"> 
 
    <br> 
 
    <input id="ourCharges" placeholder="Our Charges..." type="text"> 
 
    <br> 
 

 
    <button id="ocCalc">Calculate</button> 
 
    <p id="ocMonthly" class="words">Monthly Savings=<span id="ocMonthlySpan"></span> 
 
    </p> 
 
    <p id="ocYearly" class="words">Yearly Savings=<span id="ocYearlySpan"></span> 
 
    </p> 
 
    <p id="ocFive" class="words">Five Year Savings=<span id="ocFiveSpan"> </span> 
 
    </p> 
 
    </div> 
 
    <script> 
 
    document.getElementById("ocCalc").onclick = function() { 
 

 
     var otherFees = document.getElementById("otherCharges").value; 
 
     var ourFees = document.getElementById("ourCharges").value; 
 

 
     var ocMonthlySav = otherFees - ourFees; 
 
     var ocYearlySav = ocMonthlySav * 12; 
 
     var ocFiveSav = ocYearlySav * 5; 
 

 
     document.getElementById("ocMonthlySpan").innerHTML = " " + ocMonthlySav + "$"; 
 
     document.getElementById("ocYearlySpan").innerHTML = " " + ocYearlySav + "$"; 
 
     document.getElementById("ocFiveSpan").innerHTML = " " + ocFiveSav + "$"; 
 

 
    } 
 
    </script> 
 
</body> 
 

 
</html>

источник

2016-04-07 19:39:27 zer00ne

ответ

Смежные вопросы