js实现京东秒杀

实现效果:每个偶数小时都是秒杀时刻,显示当前时间到最近的下一个秒杀时刻的倒计时。

网页部分:

<div id="box"><span id="end"></span><br><span id="hour">02</span><span>:</span><span id="minute">00</span><span>:</span><span id="second">00</span>
</div>

 js部分:

<script>//获取节点对象var eobj = document.getElementById('end');var bobj = document.getElementById('box');var hobj = document.getElementById('hour');var mobj = document.getElementById('minute');var sobj = document.getElementById('second');//声明时、分、秒var th, tm, ts;function times() {var enddate = new Date(); //获取结束时间var nowDate = new Date(); //获取当前时间var h = enddate.getHours(); //获取结束时间的小时//两小时秒杀if (h % 2) {h++;} else {h += 2;}eobj.innerHTML = h + ':00'; //显示结束时间// 设置结束时间enddate.setHours(h);enddate.setMinutes(0);enddate.setSeconds(0);//  计算结束时间和当前时间差值var diff = (enddate - nowDate) / 1000 //获取时间差,除以1000是以秒为单位//console.log(diff);if (diff >= 0) {//通过取余实现时分秒的每60进一位th = Math.floor(diff / 60 / 60);tm = Math.floor(diff / 60 % 60);ts = Math.floor(diff % 60);//当时分秒为个位数时加个0th < 10 ? th = '0' + th : th;tm < 10 ? tm = '0' + tm : tm;ts < 10 ? ts = '0' + ts : ts;diff--;} else {clearInterval(timer); //当时间差小于零时停止计时(clearInterval)alert("时间到,结束!")}//将获得的时分秒结果重新赋给相应的内容中hobj.innerHTML = String(th);mobj.innerHTML = String(tm);sobj.innerHTML = String(ts);}//添加计时器(setInterval)每1000毫秒运行一次timer = setInterval(times, 1000);times();</script>

 

Published by

风君子

独自遨游何稽首 揭天掀地慰生平

发表回复

您的电子邮箱地址不会被公开。 必填项已用 * 标注