Javascript 实现的考试系统时间倒计-CSDN博客

本文介绍了一种在线考试系统中倒计时功能的具体实现方法，通过JavaScript定时更新剩余时间，并在时间结束后自动提交试卷。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

想必大家都知道当我进入考试系统是再试卷的一侧会显示，一个规定时间内的倒计时的计时器，那么这个倒计时器是怎样实现的呢，下面我们就分析一下，然后再去具体实现。

首先要想实现这样的功能我们就要知道其中原理是什么，其实原理很简单，就是把规定的时间每隔一秒就减一秒知道减没了也就完了(哈哈，其实说的这些都是废话)。

下面写一下实现方法：

<body>    
<form  action="路径" method="post" name="form1"></form>//写一个form表单当时间到了之后自动提交    
<input type="text" name="time1" id="time1" disabled="disabled" size="40"/>//显示时间    
<input type="button"  value="开始考试" onclick="startTime(90*60*1000)" id="but1"/>    
//这里我们以90分钟为例    
</body>    
   
   
<script type="text/javascript">    
   
    var time=new Date();    
    document.all.time1.value=time.toLocaleString();    
     var zongtime1=0;//定义递归用的传递实参    
     var ssz=60; //定义秒数    
    function startTime(oper){    
       document.getElementById("but1").disabled=true; 
       var zongtime=oper//这是总共有多少时间我们换算成毫秒    
       if(oper>0){ 
       var ohor=Math.floor(zongtime/(60*60*1000));    
         //把总的时间换算出到底有多少小时    
          
       var mine=Math.floor((zongtime-(ohor*60*60*1000))/(60*1000));    
          //除去小时的时间有多少分钟    
       var ss=(Math.floor(zongtime/1000))%60; 
         
       }    
       var wancheng=ohor+":"+mine+":"+ss;    
       document.all.time1.value=wancheng;  //把时间写入到页面对应的输入框中    
       zongtime1=zongtime-1000;    
       //alert(zongtime1);    
       var stti=setTimeout("startTime(zongtime1)",1000); //每隔一秒递归调用        
      } 
       if(zongtime==0){    
       //当时间减为0时把stti 清空    
       clearTimeout(stti);              
       //当时间减为0时自动提交表单，这个表单提交没测试，自己测试下    
       document.form1.submit();      
       alert("对不起已超时，答题以提交！！！");    
       }    
    }    
   
</script>