Question

这是我的简单javascript程序来计算..当我在document.script中调用input（）函数或A（）函数时，它的显示A未定义且输入未定义..有人可以说它是什么错误

<html>
<head>
    <title></title>
</head>
<body onload="input()">
    <script type="text/javascript">
        var name=new Array(5);
        var roll=new Array(5);
        var m1=new Array(5);
        var m2=new Array(5);
        var m3=new Array(5);
        var total=new Array(5);
        var avg=new Array(5);
        var i=1;
    </script>
    <script type="text/javascript">
        function  A()
        {
            m1[i]=parseInt(document.getElementById('m1').value);
            m2[i]=parseInt(document.getElementById('m2').value);
            m3[i]=parseInt(document.getElementById('m3').value);
            avg[i]=(m1[i]+m2[i]+m3[i])/3;
            total[i]=(m1[i]+m2[i]+m3[i]);
            var mark="Avg="+avg[i]+"<br> Total="+total[i];
            document.getElementById("1").innerHTML=mark;
            i++;
        }
    </script>      
    <script>   
        function input()
        {
            document.write(" <form name='stud'> ");
            document.write(" Enter Name  :<input type='text' name='name'><br>");
            document.write(" Enter RollNo:<input type='number' name='no'><br>");
            document.write(" Enter mark 1:<input type='number' name='m1' id='m1'><br>");
            document.write(" Enter mark 2:<input type='number' name='m2' id='m2'><br>");
            document.write(" Enter mark 3:<input type='number' name='m3' id='m3'><br>");

            document.write("<input type='button' value='calculate' onclick='A();'>");
            document.write(" <br>");

            document.write("<input type='button' value='Enter For Next Student' onclick='input()'>");
            document.write(" <br><p id='1'></p>   ");  
        }
    </script>       
</body>
</html>

Answer 1

这应该有效

<html>
<head>
    <title></title>
</head>
<body >
    <script type="text/javascript">
    var name=new Array(5);
    var roll=new Array(5);
    var m1=new Array(5);
    var m2=new Array(5);
    var m3=new Array(5);
    var total=new Array(5);
    var avg=new Array(5);
    var i=1;

    function  A()
    {
        m1[i]=parseInt(document.getElementById('m1').value);
        m2[i]=parseInt(document.getElementById('m2').value);
        m3[i]=parseInt(document.getElementById('m3').value);
        avg[i]=(m1[i]+m2[i]+m3[i])/3;
        total[i]=(m1[i]+m2[i]+m3[i]);
        var mark="Avg="+avg[i]+"<br> Total="+total[i];
        document.getElementById("result").innerHTML=mark;
        i++;
    }

    function reset()
    {
        name.value = "";
    }


    </script>
    <form name='stud'>
    Enter Name  :<input type='text' name='name' id="name"><br>
    Enter RollNo:<input type='number' name='no' id="rollNum"><br>
    Enter mark 1:<input type='number' name='m1' id='m1'><br>
    Enter mark 2:<input type='number' name='m2' id='m2'><br>
    Enter mark 3:<input type='number' name='m3' id='m3'><br>
    <input type='button' value='calculate' onclick="A()">
    <br>
    <input type='button' value='Enter For Next Student' onclick='reset()'>
    <br><p id='result'></p>
    </form>
</body>
</html>

Answer 2

请注意，代码是顺序的。例如，您在创建函数之前尝试使用input（）。这就是为什么将代码包装在 window.onload = function（）{...} 或 $（document）.ready（function（）{...这样，在创建它之前尝试使用某些东西不会遇到问题。

Answer 3

正如Roger所说，某些浏览器在遇到document.write时宁愿抛弃整个内容。

因此，如果您希望继续使用您的代码，请将所有脚本移到头顶，它应该可以工作。这样：

<head>
    <script type="text/javascript">
        var name = new Array(5);
        var roll = new Array(5);
        var m1 = new Array(5);
        var m2 = new Array(5);
        var m3 = new Array(5);
        var total = new Array(5);
        var avg = new Array(5);
        var i = 1;

        function A() {
            m1[i] = parseInt(document.getElementById('m1').value);
            m2[i] = parseInt(document.getElementById('m2').value);
            m3[i] = parseInt(document.getElementById('m3').value);
            avg[i] = (m1[i] + m2[i] + m3[i]) / 3;
            total[i] = (m1[i] + m2[i] + m3[i]);
            var mark = "Avg=" + avg[i] + "<br> Total=" + total[i];
            document.getElementById("1").innerHTML = mark;
            i++;
        }

        function input() {
            document.write(" <form name='stud'> ");
            document.write(" Enter Name  :<input type='text' name='name'><br>");
            document.write(" Enter RollNo:<input type='number' name='no'><br>");
            document.write(" Enter mark 1:<input type='number' name='m1' id='m1'><br>");
            document.write(" Enter mark 2:<input type='number' name='m2' id='m2'><br>");
            document.write(" Enter mark 3:<input type='number' name='m3' id='m3'><br>");
            document.write("<input type='button' value='calculate' onclick='A();'>");
            document.write(" <br>");
            document.write("<input type='button' value='Enter For Next Student' onclick='input()'>");
            document.write(" <br><p id='1'></p>   ");
        }
    </script>
</head>

<body onload="input()"></body>

</html>

Answer 4

问题在于document.write()在某些浏览器中彻底摧毁了整个HTML文档包括JavaScript 。

它在Chrome中运行良好。

但是，在IE中，如果您在网页上查看来源，则为：

 <form name='stud'>  Enter Name  :<input type='text' name='name'><br> Enter RollNo:<input type='number' name='no'><br> Enter mark 1:<input type='number' name='m1' id='m1'><br> Enter mark 2:<input type='number' name='m2' id='m2'><br> Enter mark 3:<input type='number' name='m3' id='m3'><br><input type='button' value='calculate' onclick='A();'> <br><input type='button' value='Enter For Next Student' onclick='input()'> <br><p id='1'></p>

查看任何JavaScript？不。它消失了。

编辑：

这是修复（有点）。问题是您需要在正文中添加HTML，而不是替换整个文档。每次运行代码时，此修订版都会向主体添加一个新的HTML。

然而，它仍然存在问题，这些问题是由于多次点击导致ID重复的元素造成的。 Id在文档中应该是唯一的。

<html>
    <head>
        <title></title>

        <script type="text/javascript">
            var name=new Array(5);
            var roll=new Array(5);
            var m1=new Array(5);
            var m2=new Array(5);
            var m3=new Array(5);
            var total=new Array(5);
            var avg=new Array(5);
            var i=1;

            function A() {
                m1[i]=parseInt(document.getElementById('m1').value);
                m2[i]=parseInt(document.getElementById('m2').value);
                m3[i]=parseInt(document.getElementById('m3').value);
                avg[i]=(m1[i]+m2[i]+m3[i])/3;
                total[i]=(m1[i]+m2[i]+m3[i]);
                var mark="Avg="+avg[i]+"<br> Total="+total[i];
                document.getElementById("1").innerHTML=mark;
                i++;
            }             

            function input() {
                var b = "";

                b = "<form name='stud'> ";
                b = b + " Enter Name  :<input type='text' name='name'><br>";
                b = b + " Enter RollNo:<input type='number' name='no'><br>";
                b = b + " Enter mark 1:<input type='number' name='m1' id='m1'><br>";
                b = b + " Enter mark 2:<input type='number' name='m2' id='m2'><br>";
                b = b + " Enter mark 3:<input type='number' name='m3' id='m3'><br>";
                b = b + "<input type='button' value='calculate' onclick='A();'>";
                b = b + " <br>";
                b = b + "<input type='button' value='Enter For Next Student' onclick='input();'>";
                b = b + " <br><p id='1'></p>   ";  

                var div = document.createElement('div');  // Create a <div> to contain the new HTML
                div.innerHTML = b;   // Set the HTML for the <div>
                document.body.appendChild(div);   // Add the new <div> to the body.
            }

            window.onload = input;  // This tells the browser to run input() when the page is done loading.

        </script>

    </head>

    <body>
    </body>
</html>

我的Javascript程序错误计算学生的平均分数

4 个答案: