显示并计算javascript测试的分数

display and calculate score for javascript quiz

本文关键字:测试 javascript 计算 显示      更新时间:2023-09-26

我是一名教师,刚刚开始学习为学生制作在线测验的代码。我对JavaScript和php之类的编程还很陌生,我曾尝试在网上寻找资源来帮助创建我的测验。我有两个问题:1) 。我已经为测验设置了计时器,但每次时间到了,它都会不断计数,我应该在中放什么

                if (parseInt(min) == 0) {
                    clearTimeout(tim);
                    location.href = "";

部分将我的学生重定向到结果页面或其他页面?

(2) 我的测验大多是填空题,我想知道如何存储每个问题的要点,然后在测验结束时向学生展示总分?非常感谢!。这是我的代码:

<html>
<head>
<script language ="javascript" >
    var tim;
    var min = 0;
    var sec = 30;
    var f = new Date();
    function f1() {
        f2();
        document.getElementById("starttime").innerHTML = "Your started your quiz at " + f.getHours() + ":" + f.getMinutes();

    }
    function f2() {
        if (parseInt(sec) > 0) {
            sec = parseInt(sec) - 1;
            document.getElementById("showtime").innerHTML = "Your Left Time  is :"+min+" Minutes ," + sec+" Seconds";
            tim = setTimeout("f2()", 1000);
        }
        else {
            if (parseInt(sec) == 0) {
                min = parseInt(min) - 1;
                if (parseInt(min) == 0) {
                    clearTimeout(tim);
                    location.href = "www.rawlanguages.com";
                }
                else {
                    sec = 60;
                    document.getElementById("showtime").innerHTML = "Your Left Time  is :" + min + " Minutes ," + sec + " Seconds";
                    tim = setTimeout("f2()", 1000);
                }
            }
        }
    }
</script>
    <title>Quiz</title>
    <h1>P.1 Grammar Quiz</h1>
    <body>
    <div id="ques0" class="ques">
     <h2>Question</h2>
    <p>She
    <input type="text" name="answerswer0"/> a girl.</p>
    </div>
    <div id="ques1" class="ques">
    <h2>Question</h2>
    <p>"is", "am" and "are" are</p>
    <ul>
    <li>
      <input type="radio" name="answerswer1" value="Present tense" />
      <label>Present tense</label>
    </li>
    <li>
      <input type="radio" name="answerswer1" value="Past tense" />
      <label>Past tense</label>
    </li>
    <li>
      <input type="radio" name="answerswer1" value="Future tense" />
      <label>Future tense</label>
    </li>
  </ul>
</div>
<div id="ques2" class="ques">
<h2>Question</h2>
<p>He
<input type="text" name="answerswer2"/> a policeman.
</p>
</div>

<a href="javascript:checkAnswer()">Check answer!</a>
<script src="JQ.js"></script>
<script src="function.js"></script>
<body onload="f1()" >
<form id="form1" runat="server">
<div>
  <table width="100%" align="center">
    <tr>
      <td colspan="2">
      </td>
    </tr>
    <tr>
      <td>
        <div id="starttime"></div>
        <div id="endtime"></div>
        <div id="showtime"></div>
      </td>
    </tr>
    <tr>
      <td>


      </td>
    </tr>
  </table>


</div>
</form>
</body>
</head>
</html>

您的代码对于初学者来说已经足够好了,但还需要一些改进。

<script type="text/javascript" >//language ="javascript" is obsolete
    //var tim; //no need at all
    //var min = 0; //no need at all
    //var sec = 30; //there is better way
    //var f = new Date(); //no need to be global
    function f1(sec) {//define (declare) sec as parameter
        f2(); //call the function
        var f = new Date();
        document.getElementById("starttime").innerHTML = "Your started your quiz at " + f.getHours() + ":" + f.getMinutes();
        var showtime = document.getElementById("showtime"); //used many times
        //Here we put (closure) f2
        function f2() {
          //f2 knows sec from parent scope
          if (sec <= 0) {//parseInt(sec) no need. sec is int
            showtime.innerHTML = 'Time is over'; 
            //ShowAnswers(); //show on the same page or post to .php
            return;
          }
            sec--;// = parseInt(sec) - 1;
            showtime.innerHTML = "Your Left Time  is :" + Math.floor(sec / 60) +" Minutes ," + (sec % 60) +" Seconds";
            setTimeout(f2, 1000);//"f2()" is correct but this way is better
        /* no need in remaining code
        }
        else {
            if (parseInt(sec) == 0) {
                min = parseInt(min) - 1;
                if (parseInt(min) == 0) {
                    clearTimeout(tim);
                    location.href = "www.rawlanguages.com";
                }
                else {
                    sec = 60;
                    document.getElementById("showtime").innerHTML = "Your Left Time  is :" + min + " Minutes ," + sec + " Seconds";
                    tim = setTimeout("f2()", 1000);
                }
            }
        }
        */
    }//f2
}//f1
</script>
<body onload="f1(90)"><!--Here we send seconds to the function -->

还要注意,从<h1>P.1...开始的所有测验都必须在body容器内。