六狼论坛

 找回密码
 立即注册

QQ登录

只需一步,快速开始

新浪微博账号登陆

只需一步,快速开始

搜索
查看: 43|回复: 0

Javascript 实现的考试系统时间倒计

[复制链接]

升级  32%

26

主题

26

主题

26

主题

秀才

Rank: 2

积分
98
 楼主| 发表于 2013-1-29 09:31:30 | 显示全部楼层 |阅读模式
想必大家都知道当我进入考试系统是再试卷的一侧会显示,一个规定时间内的倒计时的计时器,那么这个倒计时器是怎样实现的呢,下面我们就分析一下,然后再去具体实现。

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

 

下面写一下实现方法:

 
 

<body>    <form  action="路径" method="post" name="form1"></form>//写一个form表单当时间到了之后自动提交    <input type="text" name="time1" id="time1" disabled="disabled" size="40"/>//显示时间    <input type="button"  value="开始考试"  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>   
 

 

 
您需要登录后才可以回帖 登录 | 立即注册 新浪微博账号登陆

本版积分规则

快速回复 返回顶部 返回列表