JavaScript限时秒杀

最新推荐文章于 2024-04-15 10:09:06 发布

layroy

最新推荐文章于 2024-04-15 10:09:06 发布

阅读量2.2k

点赞数 4

分类专栏： JavaScript

本文链接：https://blog.csdn.net/m0_57202083/article/details/119858377

版权

JavaScript 专栏收录该内容

8 篇文章

订阅专栏

本文介绍如何使用JavaScript实现一个简单的秒杀倒计时功能，展示了从2021年10月22日18:51:59开始计时，直至结束，实时更新剩余天数、小时、分钟和秒数。

摘要由CSDN通过智能技术生成

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<div class="box">
			<div id="d"></div>		<!-- 剩余的天数 -->
			<div id="h"></div>		<!-- 剩余的小时 -->
			<div id="m"></div>		<!-- 剩余的分钟 -->
			<div id="s"></div>		<!-- 剩余的秒数 -->
		</div>
		<script>
			//设置秒杀结束时间
			var endTime = new Date('2021-10-22 18:51:59'),endSeconds = endTime.getTime();
			//定义变量保存剩余的时间
			var d = h = m = s = 0;
			//设置定时器，实现限时秒杀效果
			var id = setInterval(seckill,1000);
			function seckill(){
				var nowTime = new Date();	//获取当前时间
				 //获取时间差，单位为秒
				 var remaining = parseInt((endSeconds - nowTime.getTime())/1000);
				 if(remaining>0){//判断秒杀是否过期
					//计算剩余天数（除以60*60*24取整，获取剩余的天数）
					 d=parseInt(remaining / 86400);
					 //计算剩余小时（除以60*60转换为小时，与24小时取模，获取剩余的小时）
					 h=parseInt((remaining / 3600) % 24);
					 //计算剩余分钟（除以60转为分钟，与60取模，获取剩余的分钟）
					 m=parseInt((remaining / 60) % 60);
					 //计算剩余秒（与60取模，获取剩余的秒数）
					 s=parseInt(remaining % 60);
					 //统一利用两位数表示剩余的天、小时、分钟、秒
					 d = d<10 ? '0' + d : d;
					 h = h<10 ? '0' + h : h;
					 m = m<10 ? '0' + m : m;
					 s = s<10 ? '0' + s : s;
				 }else{
					 clearInterval(id);//秒杀过期，取消定时器
					 d = h = m = s ='00';
				 }
				 //将剩余的天，小时，分钟和秒显示到指定的网页中
				 document.getElementById('d').innerHTML = d + '天';
				 document.getElementById('h').innerHTML = h + '时';
				 document.getElementById('m').innerHTML = m + '分';
				 document.getElementById('s').innerHTML = s + '秒';
			}
		</script>
	</body>
</html>