JS实现十分钟倒计时代码实例
Posted zorasia
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了JS实现十分钟倒计时代码实例相关的知识,希望对你有一定的参考价值。
编写JS倒计时代码需要用到很多javascript知识,比如:if函数,Math.floor,定时器setInterval等等,如有不清楚的小伙伴可以参考php中文网的相关文章,或者访问 JavaScript视频教程。
举例:10分钟考试倒计时,当时间仅剩五分钟时,提醒考试仅剩5分钟,时间结束时,提示考试结束。具体代码如下:
HTML部分:
1
2
3
4
|
< body > < div id = "timer" ></ div > < div id = "warring" ></ div > </ body > |
JavaScript部分:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
|
<script type= "text/javascript" > var maxtime = 10 * 60; // function CountDown() { if (maxtime >= 0) { minutes = Math.floor(maxtime / 60); seconds = Math.floor(maxtime % 60); msg = "距离结束还有" + minutes + "分" + seconds + "秒" ; if (maxtime == 5 * 60)alert( "距离结束仅剩5分钟" ); --maxtime; } else { clearInterval(timer); alert( "时间到,结束!" ); } } timer = setInterval( "CountDown()" , 1000); </script> |
JS十分钟倒计时代码的具体步骤:
1、设置考试时长maxtime = 10 * 60秒,即10分钟
2、用if函数判断,当maxtime大于等于零时,判断剩余分和秒
3、再用if函数判断,当时间仅剩5分钟时,弹出提示:距离结束仅剩5分钟
4、如果时间到,则清除定时器,提示:结束
效果如图所示:
以上是关于JS实现十分钟倒计时代码实例的主要内容,如果未能解决你的问题,请参考以下文章