错误查找,HTML&Javascript
Bug Finding, HTML & Javascript
我很难在为类设计的看似简单的HTML/Javascript页面中找到错误。我花了几个小时仔细查看这几页的代码(还有其他三页让我抓狂(。我想知道是不是有语法上的疏漏?在本页中,我们将编写一个脚本,用于破译客户是否超过了他们的信用限额。在这个页面和其他3个页面中,onclick事件似乎不起作用。这是完整的代码:
<?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" />
<input type="reset" value="Reset Form" />
<p>Credit Available: </p>
<p id="creditAvailable"></p>
</form>
<br />
<br />
</div>
</body>
</html>
有什么好的家伙能来救援吗?
将Firebug用于Firefox或Chrome的内置调试工具(或用于其他浏览器的类似工具(,它将使您的生活更轻松。。。
至于您的特定问题,onclick
确实应该调用该函数,因此错误一定在creditCalc
函数中的某个位置。如果你仍然有问题,至少可以去浏览器中的错误控制台并在这里发布输出;如果没有任何错误消息,就很难猜测问题出在哪里。
编辑:错误控制台中也可能没有任何错误,信不信由你,这对回答你的问题的人来说也是有用的信息。
在chrome上,很容易发现javascript中的错误
在加载或重新加载chrome页面之前,您只需右键单击即可。并选择
inspect element
查找Console
单击它,您将能够在文件中看到任何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 = "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" />
<input type="reset" value="Reset Form" />
<p>Credit Available: </p>
<p id="creditAvailable"></p>
</form>
<br />
<br />
</div>
</body>
</html>
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
试着提醒和检查。
相关文章:
- Windows8应用程序(html&Javascript):从图片库(除了文件选择器)显示图像的另一种方式
- 一点javascript元编程&可链接的设置器
- 关于引入外部javascript文件的问题&css通过https
- Javascript,如果条件在没有&&逻辑运算符当&&它不起作用
- 如何添加CSS&JavaScript进入Windows窗体应用程序C#.net
- 日志Javascript&电子(原子外壳)
- 转换异常时间&Datestring到JavaScript日期
- Regex&Javascript:忽略wxyz.jpg之前的任何内容
- 尝试使用Javascript正则表达式来获取“&"分隔文本,无论它是否's是最后一个值
- 我应该用K&编写javascript时的R样式
- 使用javascript&自定义验证器检查开始日期和结束日期
- 什么正在取代我的'以及“;javascript代码中使用&#39;和&”;
- 如何安全地获取&使用Facebook应用程序访问令牌发送通知使用PHP&Javascript
- Trouble overlaying one div with another with JavaScript &
- HTML/JavaScript拖动&Drop-是否可以使重影图像*NOT*看起来'冲洗掉'
- 如果没有添加PHP&Javascript
- 简单HTML&JavaScript外壳游戏
- Javascript:函数bind.click&对于每个复选框
- 将本地MySQL数据库与PHP&谷歌地图上的JavaScript
- Javascript散列导航&外部js文件