I cannot figure out why my code continues to run even though it appears to have completely loaded the proper HTML. This problem only appears in Firefox (using ver. 3.5.3) and not in IE. This is just a simple script to display a multiplication table with a few decorative effects mixed in.
<html>
<head>
<title>Multiplication Table</title>
<script>
function drawTable(){
var rb = document.configForm.rowBegin.value - 1;
var re = document.configForm.rowEnd.value;
var cb = document.configForm.colBegin.value - 1;
var ce = document.configForm.colEnd.value;
document.write("Perfect squares are highlighted in red.<p>");
document.write("<table border=\"1\">");
for(i = rb; i <= re; i++){
document.write("<tr>");
for(j = cb; j <= ce; j++){
if(i == rb && j == cb){
// ignore top left corner
document.write("<td bgcolor=\"#ffffff\"></td>");
}
else if(i == rb){
// to display the column headers
if(j % 2 == 0)
document.write("<td align=\"center\" bgcolor=\"#99d9e0\">" + j + "</td>");
else
document.write("<td align=\"center\">" + j + "</td>");
}
else if(j == cb){
// to display the row headers
if(j % 2 == 0)
document.write("<td align=\"center\" bgcolor=\"#99d9e0\">" + i + "</td>");
else
document.write("<td align=\"center\">" + i + "</td>");
}
else{
// writes the solutions to the table
if(i == j || Math.sqrt(i*j) % 1 == 0)
// highlight the perfect squares
document.write("<td align=\"center\" bgcolor=\"#ff8080\">" + i * j + "</td>");
else if(j % 2 == 0)
document.write("<td align=\"center\" bgcolor=\"#99d9e0\">" + i * j + "</td>");
else
document.write("<td align=\"center\">" + i * j + "</td>");
}
}
document.write("</tr>");
}
document.write("</table>");
}
</script>
</head>
<body>
<h2>Multiplication Table</h2>
<form name="configForm">
Row Range:</br>
Begin <input type="text" name="rowBegin" size="5">
End <input type="text" name="rowEnd" size="5">
<p>
Column Range:</br>
Begin <input type="text" name="colBegin" size="5">
End <input type="text" name="colEnd" size="5">
<p>
<input type="Submit" value="Make Table" onclick="return drawTable()">
</form>
</body>
</html>