为什么我的数学题没有出现在屏幕上

Why is my math problems not showing up on screen?

本文关键字:屏幕 我的 数学题 为什么      更新时间:2023-09-26

我在显示用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++){

演示