JavaScript 实现京东秒杀倒计时 - 详细教程和示例
以下是一个简单的用 JavaScript 实现京东秒杀倒计时的例子:
HTML 代码:
<div id='countdown'></div>
JavaScript 代码:
// 目标时间
var targetTime = new Date('2021/12/31 23:59:59').getTime();
// 每秒更新倒计时
var countdown = setInterval(function() {
// 当前时间
var currentTime = new Date().getTime();
// 倒计时时间差
var timeDiff = targetTime - currentTime;
// 计算倒计时的小时、分钟、秒
var hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
var minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / (1000 * 60));
var seconds = Math.floor((timeDiff % (1000 * 60)) / 1000);
// 将倒计时显示在页面上
document.getElementById('countdown').innerHTML = '距离秒杀结束还剩:' + hours + '小时 ' + minutes + '分钟 ' + seconds + '秒';
// 如果倒计时结束,清除定时器
if (timeDiff <= 0) {
clearInterval(countdown);
document.getElementById('countdown').innerHTML = '秒杀已结束';
}
}, 1000);
注意,这只是一个简单的示例,实际的秒杀倒计时还需要考虑很多因素,比如服务器时间与客户端时间的同步、网络延迟等。
原文地址: https://www.cveoy.top/t/topic/nP1K 著作权归作者所有。请勿转载和采集!