首页>>网站建设>>Javascript>>经验笔记

JS实现倒计时功能

发布时间：2020-08-05 点击：43

在制作网站功能的时候，很多朋友需要实现倒计时的功能，但是没有具体思路，那么可以参考今天的这篇经验。

1、js实现倒计时代码

<body id="clock" onload="clock(3600)">      
</body>
<script>
function clock(times){
 //页面加载时设置需要倒计时的秒数，计算小时
 var shi=parseInt(times/3600);
 //计算分钟
 var fen=parseInt((times%3600)/60);
 //计算秒
 var miao=(times%3600)%60;
 //写入页面显示
 document.getElementById("clock").innerHTML=shi+"时"+fen+"时"+miao+"秒";
 if(times>0){
     //倒计时的秒数递减1
     times=times-1;
     //定时1秒，然后调用自身clock方法
     //每次递减1，不停调用自身，实现循环，知道times=0
     setTimeout(function (){
	clock(times);
	}, 1000);  
  }else{
     alert("倒计时结束");
  }
}
</script>
</html>