想必大家都知道当我进入考试系统是再试卷的一侧会显示,一个规定时间内的倒计时的计时器,那么这个倒计时器是怎样实现的呢,下面我们就分析一下,然后再去具体实现。
首先要想实现这样的功能我们就要知道其中原理是什么,其实原理很简单,就是把规定的时间每隔一秒就减一秒知道减没了也就完了(哈哈,其实说的这些都是废话)。
下面写一下实现方法:
<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>
分享到:
相关推荐
4. **数据存储**:虽然这里没有提及数据库,但实现考试系统可能需要临时存储用户的选择,这可以通过JavaScript的变量或者浏览器的本地存储(localStorage或sessionStorage)来实现。 5. **答题卡功能**:答题卡是一...
最后,利用`setTimeout`函数设置一个定时器,每隔一定时间(例如200毫秒)重新调用`clockon`函数,从而实现时间的实时更新。 ```javascript function clockon(bgclock) { var now = new Date(); var year = now....
使用JavaScript(JS)实现的网页在线考试系统。纯html js css编写特点如下:可以检查错误率可以随机从题库中出n题来练习练习题答案的ABCD是随机换位置的题库在变量arr_topic中,是一个二维数组。
<title>JavaScript倒计时 <div id="countdown"></div> <script src="countDown.js"></script> ``` 5. 结合图片资源: `countDown.png`可能用于美化倒计时显示,例如作为背景图像或倒计时图标。在CSS中...
##### 2.1 JavaScript倒计时功能实现 1. **变量初始化**: ```javascript var timeLeft = 3 * 60 * 1000; ``` - `timeLeft`:用于存储剩余时间(毫秒),初始值为3分钟(180000毫秒)。 2. **定时器函数**: ...
使用JavaScript实现页面倒计数
数据结构实验作业-JavaScript实现校园最短路径导航系统.zip 代码完整下载可用。 数据结构实验作业-JavaScript实现校园最短路径导航系统.zip 代码完整下载可用。数据结构实验作业-JavaScript实现校园最短路径导航...
js特效 JS实现在线考试系统并立即评分代码
本项目是一个基于JavaScript和MySQL实现的在线考试系统,旨在提供一个功能完善的教育平台,供学生进行自我测试和学习。这个系统包含了程序源代码、数据库设计以及详细的环境配置说明,确保了项目的可运行性和实用性...
JavaScript倒计时是一种常见的时间显示方式,常用于网站上的活动预告、考试倒计时或重要事件提醒等。在这个实例中,我们结合了JavaScript、CSS和jQuery来创建一个动态且具有视觉效果的倒计时计时器。以下是相关知识...
基于JavaScript实现的智慧烟感系统项目源码+sql数据库.zip基于JavaScript实现的智慧烟感系统项目源码+sql数据库.zip基于JavaScript实现的智慧烟感系统项目源码+sql数据库.zip基于JavaScript实现的智慧烟感系统项目...
本项目是一个基于JavaScript和MySQL实现的学校在线考试管理系统,它为教育机构提供了一种便捷的方式来组织、管理和执行在线考试。JavaScript作为前端开发语言,主要负责用户界面交互,而MySQL则作为后端数据库,用于...
该系统具有丰富的特性,包括学生登录模块、考试界面、考试时间管理、自动提交试卷以及实时显示考试成绩等。下面将详细阐述这些知识点。 1. **学生登录**:在线考试系统的首要步骤是学生登录。Java编程语言提供了...
课程设计:基于java8+jsp+mysql+tomcat+javascript实现的在线考试系统.zip 本系统设计综合应用所学知识开发一个基于MVC模式的考试系统 技术栈 java 8 + jsp + mysql + tomcat + javascript + css 相关工具组件 项目...
当计时结束时,无需刷新整个页面,而是通过Ajax发送一个异步请求到服务器,告知系统考试结束并提交试卷。Ajax的`XMLHttpRequest`对象可以创建与服务器的通信链接,通过`open`方法设置请求类型(如POST或GET)、URL和...
基于JavaScript实现的关于旅游行业数据的可视化分析系统源码.zip基于JavaScript实现的关于旅游行业数据的可视化分析系统源码.zip基于JavaScript实现的关于旅游行业数据的可视化分析系统源码.zip基于JavaScript实现的...
以上是Java实现的考试管理系统的主要设计与实现细节。该系统通过合理的权限控制、高效的试题管理以及自动化的阅卷流程,提升了考试组织的效率和公平性,同时为用户提供了一个便捷的操作环境。在实际开发过程中,还...
React项目基于JavaScript实现的全球新闻发布管理系统源码+说明文档.zipReact项目基于JavaScript实现的全球新闻发布管理系统源码+说明文档.zipReact项目基于JavaScript实现的全球新闻发布管理系统源码+说明文档....