未捕获的引用错误函数未定义Javascript

时间:2016-02-05 18:48:31

标签: javascript html function dom

计算周期性利率的简单程序,但是函数是在按钮中定义和调用的,但仍然显示未捕获引用的错误。非常感谢您的帮助

function calculatePayment(){
        var loanAmount = document.getElementById("txtLoanAmount").value;
        var interestRate = document.getElementById("txtInterestRate").value;
        var amortiPeriod = document.getElementById("txtYearlyPeriod").value;
        var totalPayment;
        var numOfMonths;

        //Convert strings from text box to integers
        loanAmount = parseInt(loanAmount);
        interestRate = parseInt(interestRate);
        amortiPeriod = parseInt(amortiPeriod);
        //Validate the input boxes to ensure values were added and follow application rules
        if (loanAmount == null || loanAmount == ""){
            //alert("You must enter a loan amount");
            message = "You must enter a loan Amount";
            document.getElementById("errorMessage").innerHTML = message;
        }else if (interestRate == null || interestRate == ""){
            //alert("You must enter a interest rate");
            message = "You must enter an interest rate";
            document.getElementById("errorMessage").innerHTML = message;
        }else if (amortiPerid == null || amortiPeriod == ""){
            //alert("You must enter an interest rate");
            message = "You must enter an interest rate";
            document.getElementById("errorMessage").innerHTML = message;
         }else if isNaN(loanAmount || interestRate || amortiPeriod){
            message = "The values you enter must be numeric";
            document.getElementById("errorMessage").innerHTML = message;
         }else{
            numOfMonths = amortiPeriod * 12;
            paymentRate = loanAmount * interestRate / 100;
            totalPayment = paymentRate * numOfMonths;
            message = totalPayment;
            document.getElementById("errorMessage").innerHTML = message;
         }

    }

这是HTML:

<tr>
                <td><input type="button" onClick="calculatePayment()" name="btnCalculate" value="Calculate Payment"/></td><td><input type="button" name="btnClear" value="Clear"/></td>
            </tr>

2 个答案:

答案 0 :(得分:2)

意外标识符:

  } else if isNaN(loanAmount || interestRate || amortiPeriod) {

使用此标记(因为您提供的不足)

<input id="calcme" type="button" name="btnCalculate" value="Calculate Payment" />
<input type="button" name="btnClear" value="Clear" />
<input type="text" id="txtInterestRate" value="10">int
<input type="text" id="txtLoanAmount" value="1200">amt
<input type="text" id="txtYearlyPeriod" value="1"> years per
<div id="errorMessage">
  errors
</div>

您需要修改此部分工作代码以解决您的实际问题:

function showError(message) {
  document.getElementById("errorMessage").innerHTML = message;
}

function showLoanAmount(amount) {
  document.getElementById("txtLoanAmount").value = amount;
}

function showInterestRate(rate) {
  document.getElementById("txtInterestRate").value = rate;
}

function showYearlyPeriod(period) {
  document.getElementById("txtLoanAmount").value = period;
}

function getLoanAmount() {
  return parseInt(document.getElementById("txtLoanAmount").value);
}

function getInterestRate() {
  return parseInt(document.getElementById("txtInterestRate").value);
}

function getYearlyPeriod() {
  return parseInt(document.getElementById("txtLoanAmount").value);
}

function calculatePayment() {
  // get values
  var loanAmount = getLoanAmount();
  var interestRate = getInterestRate();
  var amortiPeriod = getYearlyPeriod();
  var totalPayment;
  var numOfMonths;
  var message = "";

  //set values
  showLoanAmount(loanAmount);
  showInterestRate(interestRate);
  showYearlyPeriod(amortiPeriod);
  //Validate the input boxes to ensure values were added and follow application rules
  if (!loanAmount) {
    message = "You must enter a loan Amount";
    showError(message);
  }
  if (!interestRate) {
    message = "You must enter an interest rate";
    showError(message);
  }
  if (!amortiPeriod) {
    message = "You must enter an interest rate";
    showError(message);
  }
  if (isNaN(loanAmount) || isNaN(interestRate) || isNaN(amortiPeriod)) {
    message = "The values you enter must be numeric";
    showError(message);
  }
  // crappy math here
  numOfMonths = amortiPeriod * 12;
  paymentRate = loanAmount * interestRate / 100;
  totalPayment = paymentRate * numOfMonths;
  message = totalPayment;
  showError(message);

}
var el = document.getElementById("calcme");
el.addEventListener("click", calculatePayment, false);

答案 1 :(得分:0)

您的代码存在一些问题:

else if isNaN(loanAmount || interestRate || amortiPeriod)

应检查每个变量以确定它是否不是数字,例如:isNaN(loanAmount) || isNaN(interestRate) || isNaN(amortiPeriod)

举个例子: https://jsfiddle.net/zpep0t1q/1/

此行也有拼写错误:

} else if (amortiPerid == null || amortiPeriod == ""){

amortiPerid不是amortiPeriod