Question

所以我正在尝试为我的工作制作一个计算器。基本上，如果他们和我们公司一起来计算某人的储蓄，我们就会这样做。我有3个工作部分，但当我尝试添加另一个时，它不起作用。我将发布一个工作部分，然后发布不起作用的部分。

WORKING：

<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是正确的标签，我只是没有把它们放在帖子里。

Answer 1

这一行有一个错字：

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

o c FiveSpan not o v FiveSpan

此外，将JavaScript包装在<script>代码中非常重要。

<强>段

＆＃13;

<!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>

＆＃13;

JavaScript计算器程序

1 个答案: