过去几天我一直在疯狂地试图解决这个问题，而我完全不知道该怎么办。
对于我必须为课程做的作业，我们必须分析以下JavaScript代码并更正错误。我已经设法弄清楚了大部分内容，但我最后一部分被困住了。
每当我点击＆＃34;计算＆＃34;按钮，它返回"$NaN.undefined"每月付款金额。我一遍又一遍地重复了代码，一切似乎与我在教科书中显示的内容相符，所以我不知道我需要改变什么以使其正常工作。
我刚刚开始学习JavaScript，所以我对此非常陌生。任何人都可以给予我的帮助或指导将非常感激。
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-type" content="text/html;charset=UTF-8" />
<title>Make10-1 Oakwood Mortgage</title>
<script type="text/javascript">
<!--Hide from old browsers
var thisMsg=" ** See us for your auto loan financing needs!!! ** "
var beginPos=0
function scrollingMsg() {
msgForm.scrollingMsg.value=thisMsg.substring(beginPos,thisMsg.length)+thisMsg.substring(0,beginPos)
beginPos+=1
if (beginPos > thisMsg.length) {
beginPos=0
}
window.setTimeout("scrollingMsg()",200)
}
var salesAmt
var loanAmt
var loanRate
var loanYears
function valSaleDownAmt() {
var salesAmt=parseInt(LoanCalc.SaleAmt.value,10)
if (isNaN(salesAmt) || (salesAmt <=0)) {
alert("The sales amount is not a valid number!")
LoanCalc.SaleAmt.value = ""
LoanCalc.SaleAmt.focus()
}
else {
var DownPayment=parseFloat(LoanCalc.DownPmt.value)/100
if (isNaN(DownPayment) || (DownPayment <= 0) || DownPayment > 100) {
alert("The Down Payment Rate is not a valid number!")
LoanCalc.DownPmt.value = " "
LoanCalc.DownPmt.focus()
}
else {
var amtDown = salesAmt*DownPayment
var loanAmt = salesAmt-amtDown
LoanCalc.LoanAmt.value = dollarFormat(loanAmt.toFixed(2))
LoanCalc.Rate.focus()
}
}
}
function CalcLoanAmt() {
loanRate=parseFloat(LoanCalc.Rate.value)
if (isNaN(loanRate) || (loanRate <= 0)) {
alert("The interest rate is not a valid number!")
LoanCalc.Rate.value = ""
LoanCalc.Rate.focus()
}
else {
loanYears=parseInt(LoanCalc.Years.selectedIndex)
if (isNaN(loanYears) || (loanYears < 1)) {
alert("Please select a valid number of years from the list!")
LoanCalc.Years.selectedIndex = "0"
LoanCalc.Years.focus()
}
else {
var monthlyPmt = monthly(loanAmt,loanRate,loanYears)
LoanCalc.Payment.value=dollarFormat(monthlyPmt.toString())
}
}
}
function monthly(loanAmt,loanRate,loanYears) {
var Irate = loanRate/1200
var Pmts = loanYears*12
var Amnt = loanAmt * (Irate / (1 - (1 / Math.pow(1+Irate,Pmts))))
return Amnt.toFixed(2)
}
function dollarFormat(valuein) {
var formatValue = ""
var formatDollars = ""
formatAmt = valuein.split(".",2)
var dollars = formatAmt[0]
var dollarLen = dollars.length
if (dollarLen > 3) {
while (dollarLen > 0) {
tempDollars = dollars.substring(dollarLen - 3,dollarLen)
if (tempDollars.length == 3) {
formatDollars = "," + tempDollars + formatDollars
dollarLen = dollarLen - 3
} else {
formatDollars = tempDollars + formatDollars
dollarLen = 0
}
}
if (formatDollars.substring(0,1) == ",")
dollars = formatDollars.substring(1,formatDollars.length)
else
dollars = formatDollars
}
var cents = formatAmt[1]
var formatValue="$"+dollars+"."+cents
return formatValue
}
function popUpAd() {
open("make10-1notice.html","noticeWin","width=520,height=270")
}
function lastModified() {
var lastModDate = document.lastModified
var lastModDate = lastModDate.substring(0,10)
displayDateLast.innerHTML="<span style='font-family:Arial, Helvetica, sans-serif; font-size:9px; font-weight:bold'>This document was last modified "+lastModDate+"</span>"
}
//-->
</script>
<style type="text/css">
<!--
body {
background-image: url(financial_symbol.jpg);
}
-->
</style>
</head>
<body onload="scrollingMsg(); popUpAd(); lastModified()">
<div align="center">
<p align="center"><img src="make10-1banner.jpg" width="750" height="120" alt="banner" /></p>
<form id="msgForm" action="">
<p style="text-align:center"><input type="text" name="scrollingMsg" size="25" /></p>
</form>
</div>
<div style="font-family:Arial, Helvetica, sans-serif">
<h3 align="center">Home Loan Payment Calculator</h3>
<form id="LoanCalc" action="">
<table width="346" align="center" cellspacing="3">
<tr>
<td align="right">
<span style="color:#cc0000">*</span>Sale Price:
</td>
<td><input type="text" name="SaleAmt" id="SaleAmt" size="9" /></td>
</tr>
<tr>
<td align="right">
<span style="color:#cc0000">*</span> Down Payment as a percent
</td>
<td><input name="DownPmt" type="text" id="DownPmt" size="4" onblur="valSaleDownAmt()" />
%</td>
</tr>
<tr>
<td align="right">
<span style="color:#cc0000">*</span> Interest Rate (e.g. 5.9):
</td>
<td><input type="text" name="Rate" id="Rate" size="4" /> %
</td>
</tr>
<tr>
<td align="right">
<span style="color:#cc0000">*</span> Select Number of Years:
</td>
<td><select name="Years" id="Years">
<option selected="selected">Select Years</option>
<option value="10">10</option>
<option value="15">15</option>
<option value="20">20</option>
<option value="25">25</option>
<option value="30">30</option>
<option value="40">40</option>
</select></td>
</tr>
<tr>
<td align="right">
<input name="button" type="button" value="Calculate" onclick="CalcLoanAmt()" />
</td>
<td>
<input name="Reset" type="reset" />
</td>
</tr>
<tr>
<td align="right">
<span style="color:#cc0000">*</span> Loan Amount
</td>
<td>
<input name="LoanAmt" type="text" id="LoanAmt" size="9" />
</td>
</tr>
<tr>
<td align="right">
<span style="font-weight:bolder">Monthly Payment</span>:
</td>
<td><input type="text" name="Payment" id="Payment" value=" " size="12" /></td>
</tr>
</table>
<p style="color:#cc0000; text-align:center">* Indicates a required field.</p>
</form>
</div>
<div id="displayDateLast" style="margin-left:5%">
</div>
</body>
</html>
答案 0 :(得分：0)
学习使用调试器逐步执行代码的绝佳机会。在函数中添加几个断点来计算值，并设置监视用于计算每月付款的变量，并确定它们开始返回无效值的位置。您可以立即找到有问题的代码：）
您可以在https://developer.chrome.com/devtools/docs/javascript-debugging了解Chrome的调试器。在https://www.youtube.com/watch?v=htZAU7FM7GI还有一个不错的介绍性视频。
此外，虽然技术上不需要，但您应该用分号结束语句。如果您不知道Javascript的所有各种语句规则，则遗漏分号会产生意外结果。
答案 1 :(得分：0)
我认为比尔有最好的“答案”。但我认为在这个特定的例子中，你已经在2个地方定义了loanAmt（var loanAmt）。
我认为你不希望它在第二位（局部变量）定义。
当CalcLoadAmount立即调用Monthly时，未定义`loadAmt“的值。我尝试删除第二个变量声明，它可能是您需要的修复.... / p>
function valSaleDownAmt() {
var salesAmt=parseInt(LoanCalc.SaleAmt.value,10)
if (isNaN(salesAmt) || (salesAmt <=0)) {
alert("The sales amount is not a valid number!")
LoanCalc.SaleAmt.value = ""
LoanCalc.SaleAmt.focus()
}
else {
var DownPayment=parseFloat(LoanCalc.DownPmt.value)/100
if (isNaN(DownPayment) || (DownPayment <= 0) || DownPayment > 100) {
alert("The Down Payment Rate is not a valid number!")
LoanCalc.DownPmt.value = " "
LoanCalc.DownPmt.focus()
}
else {
var amtDown = salesAmt*DownPayment
//
// THIS IS THE LINE I CHANGED RIGHT BELOW THIS COMMENT**
//
loanAmt = salesAmt-amtDown
LoanCalc.LoanAmt.value = dollarFormat(loanAmt.toFixed(2))
LoanCalc.Rate.focus()
}
}
}
答案 2 :(得分：0)
我认为问题的出现是因为你的价值观始终未定义。在声明变量的脚本顶部，没有给出默认值。尝试给它们默认值0.你不应该再定义。这不会完全解决您的问题，但这是一个良好的开端。此外，您应该尝试通过将变量放在变量之前使变量成为全局变量。所以对于顶部的变量呢 this.salesAmt = 0 this.loanAmt = 0 this.loanRate = 0 this.loanYears = 0
它们出现在你的代码中的任何地方都会把它放在它们面前。
答案 3 :(得分：0)
问题与Brad Parks提到的loanAmt变量有关（它不会让我发表评论）。如果将以下代码添加到CalcLoanAmt（）的开头，该函数将起作用。虽然可能有更好的方法来执行此操作，但此代码将修复它。祝你好运！
loanAmt=parseInt(LoanCalc.SaleAmt.value,10) - (parseFloat(LoanCalc.DownPmt.value)/100)
答案 4 :(得分：0)
我在你的两个函数中做了一些修改，其余的函数和html都很好。它有效，请检查： -
function valSaleDownAmt() {
var saleAmtInput = document.getElementById("SaleAmt"),
salesAmt=parseInt(saleAmtInput.value,10),
downPaymentInput = document.getElementById('DownPmt'),
DownPayment=parseFloat(downPaymentInput.value)/100,
loanRateInput = document.getElementById('Rate'),
loanRate=parseFloat(loanRateInput.value),
loanYearsInput = document.getElementById('Years'),
loanYears=parseInt(loanYearsInput.value);
if (isNaN(salesAmt) || (salesAmt <=0)) {
alert("The sales amount is not a valid number!")
saleAmtInput.value = ""
saleAmtInput.focus()
}
else if (isNaN(DownPayment) || (DownPayment <= 0) || DownPayment > 100) {
alert("The Down Payment Rate is not a valid number!")
downPaymentInput.value = " "
downPaymentInput.focus()
} else if (isNaN(loanRate) || (loanRate <= 0)) {
alert("The interest rate is not a valid number!")
loanRateInput.value = ""
loanRateInput.focus()
} else if (isNaN(loanYears) || (loanYears < 1)) {
alert("Please select a valid number of years from the list!")
}
else {
CalcLoanAmt(salesAmt,DownPayment,loanRate,loanYears);
}
}
function CalcLoanAmt(salesAmt,DownPayment,loanRate,loanYears) {
var amtDown = salesAmt*DownPayment,
loanAmt = salesAmt-amtDown,
monthlyPmt = monthly(loanAmt,loanRate,loanYears);
document.getElementById('Payment').value=dollarFormat(monthlyPmt.toString());
document.getElementById('LoanAmt').value = loanAmt;
}
这意味着，不需要全局变量，如： -
var salesAmt
var loanAmt
var loanRate
var loanYears
您可以删除此变量。
你必须在html的两个地方进行修改： -
一个是： -
<tr>
<td align="right">
<span style="color:#cc0000">*</span> Down Payment as a percent
</td>
<td><input name="DownPmt" type="text" id="DownPmt" size="4" />
%</td>
</tr>
这意味着，您必须在输入框的模糊处删除函数调用。
第二个是： -
<tr>
<td align="right">
<input name="button" type="button" value="Calculate" onclick="valSaleDownAmt()" />
</td>
<td>
<input name="Reset" type="reset" />
</td>
</tr>
这意味着您可以在单击计算按钮时调用函数valSaleDownAmt而不是函数CalcLoanAmt。
前面代码的功能是相同的，但在某些情况下会引起一些问题，所以我认为这是更合适的代码。试试吧。