为什么我的数学题没有出现在屏幕上
Why is my math problems not showing up on screen?
我在显示用javascript创建的数学问题时遇到问题。我不确定我是错过了什么,还是需要拿点什么出来。如果能在这件事上给我任何帮助或意见,我将不胜感激。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Interactive Math Worksheet</title>
<script type="text/javascript">
var mathProblem = new Array();
// writing the problem 10 times
function writeProblem() {
var num1 = new Array();
var num2 = new Array();
for (var i = 0; i < 10; i++) {
num1 = (Math.floor(Math.random() * 50) + 1);
num2 = (Math.floor(Math.random() * 50) + 1);
document.getElementById("t" + i).innerHTML = num1;
document.getElementById("b" + i).innerHTML = "+" + num2;
mathProblem[i] = num1 + num2;
document.forms["prob" + i]["a" + i].value = "";
}
}
</script>
</head>
<body onload="writeProblem()">
<table border="0" cellspacing="50" id="frm1" width="800">
<tr>
<td width="50">
<label id="t1"></label><br>
<label id="b1"></label><br>
<hr>
<form name="prob1">
<input name="a1" size="3" type="text">
</form>
</td>
<td width="50">
<label id="t2"></label><br>
<label id="b2"></label><br>
<hr>
<form name="prob2">
<input name="a2" size="3" type="text">
</form>
</td>
<td width="50">
<label id="t3"></label><br>
<label id="b3"></label><br>
<hr>
<form name="prob3">
<input name="a3" size="3" type="text">
</form>
</td>
<td width="50">
<label id="t4"></label><br>
<label id="b4"></label><br>
<hr>
<form name="prob4">
<input name="a4" size="3" type="text">
</form>
</td>
<td width="50">
<label id="t5"></label><br>
<label id="b5"></label><br>
<hr>
<form name="prob5">
<input name="a5" size="3" type="text">
</form>
</td>
</tr>
<tr>
<td>
<label id="t6"></label><br>
<label id="b6"></label><br>
<hr>
<form name="prob6">
<input name="a6" size="3" type="text">
</form>
</td>
<td>
<label id="t7"></label><br>
<label id="b7"></label><br>
<hr>
<form name="prob7">
<input name="a7" size="3" type="text">
</form>
</td>
<td>
<label id="t8"></label><br>
<label id="b8"></label><br>
<hr>
<form name="prob8">
<input name="a8" size="3" type="text">
</form>
</td>
<td>
<label id="t9"></label><br>
<label id="b9"></label><br>
<hr>
<form name="prob9">
<input name="a9" size="3" type="text">
</form>
</td>
<td>
<label id="t10"></label><br>
<label id="b10"></label><br>
<hr>
<form name="prob10">
<input name="a10" size="3" type="text">
</form>
</td>
</tr>
</table>
</body>
</html>
我注意到你是从i=0;
和getElementById("t"+i)
开始的,但没有id为t0
的元素。希望这能帮助
只需检查for循环。我已经解决了这个问题。
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Interactive Math Worksheet</title>
<script type="text/javascript">
var mathProblem = new Array();
// writing the problem 10 times
function writeProblem(){
var num1 = new Array();
var num2 = new Array();
for (var i=1; i<11; i++){
num1 = (Math.floor(Math.random()*50)+1);
num2 = (Math.floor(Math.random()*50)+1);
document.getElementById("t"+i).innerHTML = num1;
document.getElementById("b"+i).innerHTML = "+" + num2;
mathProblem[i] = num1 + num2;
document.forms["prob"+i]["a"+i].value = "";
}
}
</script>
</head>
<body onload="writeProblem()">
<table id="frm1" width="800" border="0" cellspacing="50">
<tr>
<td width="50"><label id="t1"></label><br /><label id="b1"></label><br /><hr /><form name="prob1"><input type="text" size="3" name="a1"></form></td>
<td width="50"><label id="t2"></label><br /><label id="b2"></label><br /><hr /><form name="prob2"><input type="text" size="3" name="a2"></form></td>
<td width="50"><label id="t3"></label><br /><label id="b3"></label><br /><hr /><form name="prob3"><input type="text" size="3" name="a3"></form></td>
<td width="50"><label id="t4"></label><br /><label id="b4"></label><br /><hr /><form name="prob4"><input type="text" size="3" name="a4"></form></td>
<td width="50"><label id="t5"></label><br /><label id="b5"></label><br /><hr /><form name="prob5"><input type="text" size="3" name="a5"></form></td>
</tr>
<tr>
<td><label id="t6"></label><br /><label id="b6"></label><br /><hr /><form name="prob6"><input type="text" size="3" name="a6"></form></td>
<td><label id="t7"></label><br /><label id="b7"></label><br /><hr /><form name="prob7"><input type="text" size="3" name="a7"></form></td>
<td><label id="t8"></label><br /><label id="b8"></label><br /><hr /><form name="prob8"><input type="text" size="3" name="a8"></form></td>
<td><label id="t9"></label><br /><label id="b9"></label><br /><hr /><form name="prob9"><input type="text" size="3" name="a9"></form></td>
<td><label id="t10"></label><br /><label id="b10"></label><br /><hr /><form name="prob10"><input type="text" size="3" name="a10"></form></td>
</tr>
</table>
</body>
</html>
您的id以t0
/b0
开头,因此您必须将索引从1:开始更改
for (var i=1; i<=10; i++){
演示
相关文章:
- 我需要一个jQuery函数来只工作在700px以上的屏幕大小,无法在我的代码中发现错误
- 我可以通过点击html文件中的按钮来记录我的屏幕/网页吗
- 为什么我的网站在IE中是空白屏幕?(包括IE9!
- 我希望每次单击按钮时都能将每张图片更改为显示在屏幕上的同一位置
- 为什么我的chosen.js放大镜图标在Retina屏幕上的位置不对
- 我怎么能防止我的主播在屏幕上跳来跳去
- 根据屏幕尺寸管理我的边距
- 我不希望我的“播放器”离开屏幕,我该如何防止这种情况
- iPhone设备黑色屏幕在我的jQuery手机Gap应用程序导航中闪烁
- iframe 中的箭头键影响我的主屏幕
- 如何将我的屏幕尺寸放入警报中?JavaScript
- 我希望我的动画在屏幕上水平移动,并在按下停止按钮后停止
- 我为我的 Gif 制作了一个代码,让一只鸟飞过屏幕,但即使它在同一文件夹中,图像也不可见
- 为什么我的网站的内容在方形窗口上重叠(屏幕宽度和高度相等)
- 图像旋转到宽离开我的屏幕如何保持静态或缩短宽度
- 在我的手指已经在屏幕上之后,如何捕捉添加到DOM的元素上的touchmove事件
- 在屏幕上定位我的图像滑块,而不进行自动调整
- 如何在我的情况下创建加载屏幕
- 我如何使我的图像在页面上移动,即使当屏幕的分辨率改变
- 我的网站的导航栏按钮没有跳转到屏幕的正确部分