js考试倒计时功能

最新推荐文章于 2023-11-06 09:36:43 发布

**铧**

最新推荐文章于 2023-11-06 09:36:43 发布

阅读量2.8k

点赞数 1

文章标签： js

本文链接：https://blog.csdn.net/weixin_44342683/article/details/105607365

版权

创建一个html文档，实现考试计时的功能，即从文档打开开始计算，50分钟时提示离考试结束还有10分钟，60分钟中，提示考试结束，并自动关闭窗口。
话不多说，赶紧看代码：

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>倒计时</title>
</head>
<body>
距离考试结束还剩<div id="cal"></div><br>
<button onclick="start()">开始考试</button>

<script type="text/javascript">
var min=60;
var sec=0;
var t;

function start() {
	clock();
	if(sec==0){
		min--;
		sec=60;
	}
	sec--;
	if(min==10){
		alert("距离考试结束还剩10分钟");
	}
	if(min==0){
		alert("考试结束");
		window.clearTimeout(t);
		window.close();
	}
	//设置计时器，1000毫秒(即1秒)调用函数
	t=setTimeout("start()",1000);
}
//输出样式判断
function clock() {
	if(min<10&&sec<10)
	document.getElementById("cal").innerHTML="0"+min+":"+"0"+sec;
	else if(min<10)
	document.getElementById("cal").innerHTML="0"+min+":"+sec;
	else if(sec<10)
	document.getElementById("cal").innerHTML=min+":"+"0"+sec;
	else
	document.getElementById("cal").innerHTML=min+":"+sec;
	
}
</script>
</body>
</html>

一个简单的考试倒计时就这样实现了。

除了用setTimeout()和clearTimeout()这两个函数实现倒计时功能，还可以使用与这两个函数相似的setInterval()和clearInterval()函数来实现，代码都是差不多的，这里就不发了。

**铧**

关注

1
点赞
踩
20

收藏

觉得还不错? 一键收藏
2
评论
js考试倒计时功能

创建一个html文档，实现考试计时的功能，即从文档打开开始计算，50分钟时提示离考试结束还有10分钟，60分钟中，提示考试结束，并自动关闭窗口。话不多说，赶紧看代码：<!DOCTYPE html><html><head><meta charset="UTF-8"><title>倒计时</title></he...
复制链接

扫一扫