2013-02-25 31 views
0

我正在尋找看似簡單的HTML/Javascript頁面中的錯誤,我正在爲一個類進行設計。我花了好幾個小時來查看這些頁面的代碼(以及其他3個令我瘋狂的代碼)。我想知道是否有一些語法被我忽略了?在這個頁面中,我們將編寫一個腳本,用於解釋客戶是否超過了信用額度。在這個頁面和其他3,onclick事件似乎並沒有工作。這裏是完整的代碼:錯誤查找,HTML和Javascript

<?xml version="1.0" encoding="UTF-8"?> 
<!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" xml:lang="en" lang="en"> 

<head> 
<title>Homework 3 Part 3</title> 
<style type="text/css"> 
tr.visiting {background-color: #000000; } 


h1.header {color: #333333;} 
.creditbox { 

    background-color: #ffcc66; 
    width: 60%; 
    border:solid 5px #666666; 
    margin-left:auto; 
margin-right:auto; 

} 

table { 
    text-align: right; 
} 
td.visiting {background-color: #000000; } 
input {text-align: right;} 
</style> 
<script type="text/javascript"> 
/* <![CDATA[ */ 

function creditCalc() 
{ 
    var account, credLim, begBalance, totalCharged, credit, balance, endBalance; 

    account = parseInt(document.creditLimitForm.accountNum.value); 
    credLim = parseInt(document.creditLimitForm.creditLimit.value); 
    begBalance = parseInt(document.creditLimitForm.beginningBalance.value); 
    totalCharged = parseInt(document.creditLimitForm.amtCharged.value); 
    credit = parseInt(document.creditLimitForm.creditsApplied.value); 

    balance = begBalance + totalCharged; 
    endBalance = balance - credit; 

    documemt.creditLimitForm.creditDisplay.value("Account Number: " + account + "\nCredit Limit: " + credLim + "\nBeginning Balance: " + begBalance + "\nTotal Charged this month: " + totalCharged + "\nTotal credits this month: " + credit + "\nCredit Available: " + endBalance); 

document.getElementById("creditAvailable").innerHTML = endBalance; 

} 

/*]]>*/ 
</script> 

</head> 

<body bgcolor = "#ffffff" alink = "#FFFFCC" link = "#FFFFCC" vlink = "#FFFFCC"> 
<table id="border" width="70%" align ="center" cellpadding="0"> 
     <tr> 
     <td align="center"> 
      <img src="hw3Banner.jpg" alt="Homework Banner" align="middle" /> 
     </td> 
     </tr> 
    </table> 
    <br /> 
    <table border="1" width="500" align ="center" bgcolor="#666666" cellpadding="2.5"> 
    <tr><td align = "center"><font face ="baskerville" color="#FFFFCC" /><a href="homework3.html">HW 3 Main</a></td> 
    <td align = "center"><font face ="baskerville" color="#FFFFCC" /><a href="homework3pt1.html">Part 1</a></td> 
    <td align = "center"><font face ="baskerville" color="#FFFFCC" /><a href="homework3pt2.html">Part 2</td> 
    <td class="visiting" align = "center"><font face ="baskerville" color="#FFFFCC" /><a href="homework3pt3.html">Part 3</a></td> 
    <td align = "center"><font face ="baskerville" color="#FFFFCC" /><a href="homework3pt4.html">Part 4</a></td> 
    <td align = "center"><font face ="baskerville" color="#FFFFCC" /><a href="homework3pt5.html">Part 5</a></td> 
    <td align = "center"><font face ="baskerville" color="#FFFFCC" /><a href="homework3pt6.html">Part 6</a></td></tr></table> 

<br /> 
<div class="creditbox" align="center" > 
<form name="creditLimitForm" action=""> 
<br /> 
<h1 class="header">Customer Credit Limit Check</h1> 
<br /> 


<table class="creditLimitForm"> 
<tr> 
<td>Customer Account Number:</td> 
<td><input type="text" id="accountNum" name="accountNum" size="15" /></td> 
</tr> 
<tr> 
<td>1st of Month Balance: </td> 
<td>$<input type="text" id="beginningBalance" name="beginningBalance" size="15" /></td></tr> 
<tr> 
<td>Total charged by customer this month: </td> 
<td>$<input type="text" id="amtCharged" name="amtCharged" size="15" /></td> 
</tr> 
<tr> 
<td>Total credits applied to account </td> 
<td>$<input type="text" id="creditsApplied" name="creditsApplied" size="15" /></td> 
</tr> 
<tr> 
<td>Allowed Credit Limit</td> 
<td>$<input type="text" id= "creditLimit" name="creditLimit" size="15" /></td> 
</tr> 
</table> 

<br /> 
<textarea rows="7" cols="50" name="creditDisplay"></textarea> 
<br /><br /> 
<input type="button" onclick="creditCalc();" value="Check Credit" />&nbsp;&nbsp;&nbsp;&nbsp; 

<input type="reset" value="Reset Form" /> 

<p>Credit Available: </p> 
<p id="creditAvailable"></p> 

</form> 
<br /> 
<br /> 
</div> 
</body> 
</html> 

誰可以來拯救任何良好的de-buggers?

+1

您的瀏覽器的調試器如何? – 2013-02-25 05:14:40

+0

Firebug lite :) – EnterJQ 2013-02-25 05:15:59

+0

與你的問題無關,但你應該拋棄XML序言,文檔類型和語法。使用普通的'<!DOCTYPE html>'。 XHTML過渡性DOCTYPE(可追溯到2000年)只適用於不理解XML的瀏覽器,並且幫助從未發生的從HTML到XML的過渡,所以不要使用它。 – RobG 2013-02-25 05:41:11

回答

0

使用Firebug的Firefox或Chrome內置的調試工具(或其他瀏覽器類似的工具),它會讓你的生活更輕鬆......

至於你的具體問題,onclick確實應該調用該函數,所以錯誤必須在creditCalc函數中的某處。至少在瀏覽器中訪問錯誤控制檯,如果仍有問題,請在此處輸出;沒有任何錯誤消息,這使得猜測問題的可能性更加困難。

編輯:也有可能在錯誤控制檯中沒有任何錯誤,相信與否對於那些回答你的問題的人來說也是有用的信息。

0

在鉻上,它很容易找到JavaScript中的錯誤。
您必須在加載或重新加載頁面之前進行右鍵單擊。並選擇

inspect element 

比底部工具欄。看着爲Console點擊它,你將能夠看到任何JavaScript錯誤在您的文件。

0

好吧,這裏試試這個代碼:

<?xml version="1.0" encoding="UTF-8"?> 
<!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" xml:lang="en" lang="en"> 

<head> 
<title>Homework 3 Part 3</title> 
<style type="text/css"> 
tr.visiting {background-color: #000000; } 


h1.header {color: #333333;} 
.creditbox { 

    background-color: #ffcc66; 
    width: 60%; 
    border:solid 5px #666666; 
    margin-left:auto; 
margin-right:auto; 

} 

table { 
    text-align: right; 
} 
td.visiting {background-color: #000000; } 
input {text-align: right;} 
</style> 
<script type="text/javascript"> 
/* <![CDATA[ */ 

function creditCalc() 
{ 
var account, credLim, begBalance, totalCharged, credit, balance, endBalance; 

    account = parseInt(document.creditLimitForm.accountNum.value); 
    credLim = parseInt(document.creditLimitForm.creditLimit.value); 
    begBalance = parseInt(document.creditLimitForm.beginningBalance.value); 
    totalCharged = parseInt(document.creditLimitForm.amtCharged.value); 
    credit = parseInt(document.creditLimitForm.creditsApplied.value); 

    balance = begBalance + totalCharged; 
    endBalance = balance - credit; 
/* 
    documemt.creditLimitForm.creditDisplay.value("Account Number: " + account + "\nCredit Limit: " + credLim + "\nBeginning Balance: " + begBalance + "\nTotal Charged this month: " + totalCharged + "\nTotal credits this month: " + credit + "\nCredit Available: " + endBalance);*/ 

document.getElementById("creditAvailable").innerHTML = "Account Number: " + account + "\nCredit Limit: " + credLim + "\nBeginning Balance: " + begBalance + "\nTotal Charged this month: " + totalCharged + "\nTotal credits this month: " + credit + "\nCredit Available: " + endBalance; 

} 

/*]]>*/ 
</script> 

</head> 

<body bgcolor = "#ffffff" alink = "#FFFFCC" link = "#FFFFCC" vlink = "#FFFFCC"> 
<table id="border" width="70%" align ="center" cellpadding="0"> 
     <tr> 
     <td align="center"> 
      <img src="hw3Banner.jpg" alt="Homework Banner" align="middle" /> 
     </td> 
     </tr> 
    </table> 
    <br /> 
    <table border="1" width="500" align ="center" bgcolor="#666666" cellpadding="2.5"> 
    <tr><td align = "center"><font face ="baskerville" color="#FFFFCC" /><a href="homework3.html">HW 3 Main</a></td> 
    <td align = "center"><font face ="baskerville" color="#FFFFCC" /><a href="homework3pt1.html">Part 1</a></td> 
    <td align = "center"><font face ="baskerville" color="#FFFFCC" /><a href="homework3pt2.html">Part 2</td> 
    <td class="visiting" align = "center"><font face ="baskerville" color="#FFFFCC" /><a href="homework3pt3.html">Part 3</a></td> 
    <td align = "center"><font face ="baskerville" color="#FFFFCC" /><a href="homework3pt4.html">Part 4</a></td> 
    <td align = "center"><font face ="baskerville" color="#FFFFCC" /><a href="homework3pt5.html">Part 5</a></td> 
    <td align = "center"><font face ="baskerville" color="#FFFFCC" /><a href="homework3pt6.html">Part 6</a></td></tr></table> 

<br /> 
<div class="creditbox" align="center" > 
<form name="creditLimitForm" action=""> 
<br /> 
<h1 class="header">Customer Credit Limit Check</h1> 
<br /> 


<table class="creditLimitForm" id="creditLimitForm"> 
<tr> 
<td>Customer Account Number:</td> 
<td><input type="text" id="accountNum" name="accountNum" size="15" /></td> 
</tr> 
<tr> 
<td>1st of Month Balance: </td> 
<td>$<input type="text" id="beginningBalance" name="beginningBalance" size="15" /></td></tr> 
<tr> 
<td>Total charged by customer this month: </td> 
<td>$<input type="text" id="amtCharged" name="amtCharged" size="15" /></td> 
</tr> 
<tr> 
<td>Total credits applied to account </td> 
<td>$<input type="text" id="creditsApplied" name="creditsApplied" size="15" /></td> 
</tr> 
<tr> 
<td>Allowed Credit Limit</td> 
<td>$<input type="text" id= "creditLimit" name="creditLimit" size="15" /></td> 
</tr> 
</table> 

<br /> 
<textarea rows="7" cols="50" name="creditDisplay"></textarea> 
<br /><br /> 
<input type="button" onclick="creditCalc();" value="Check Credit" />&nbsp;&nbsp;&nbsp;&nbsp; 

<input type="reset" value="Reset Form" /> 

<p>Credit Available: </p> 
<p id="creditAvailable"></p> 

</form> 
<br /> 
<br /> 
</div> 
</body> 
</html> 
0
the problem with your this line otherwise its working fine.just try with alert instead. 

    documemt.creditLimitForm.creditDisplay.value("Account Number: " + account + "\nCredit Limit: " + credLim + "\nBeginning Balance: " + begBalance + "\nTotal Charged this month: " + totalCharged + "\nTotal credits this month: " + credit + "\nCredit Available: " + endBalance); 

這是創造問題。

documemt.creditLimitForm.creditDisplay.value

嘗試警報和檢查。