本文实例为大家分享了微信小程序实现倒计时功能的具体代码，供大家参考，具体内容如下商城商品中的活动倒计时js
var endTime = new Date().getTime() + 24 * 3600 * 1000*4;

Page({

/**
* 页面的初始数据
*/
data: {
headerImgs: postData.postSwiperData,
countDownDay: '',
countDownHour: '',
countDownMinute: '',
countDownSecond: '',
},

/**
* 生命周期函数--监听页面加载
*/
onLoad: function(options) {
var id = options.id; //页面跳转传过来的值
},
onReady: function() {
var that = this;

countdown(that);
}
})

function countdown(that) {
var NowTime = new Date().getTime();
var EndTime = endTime;
var total_micro_second = EndTime - NowTime || [];
console.log('当前时间'+NowTime+'\n剩余时间：' + total_micro_second);
// 渲染倒计时时钟
that.setData({
countDownDay: dateformaDay(total_micro_second),
countDownHour: dateformaHour(total_micro_second),
countDownMinute: dateformaMinute(total_micro_second),
countDownSecond: dateformaSecondMinute(total_micro_second),
});
// if (total_micro_second <= 0) {
// that.setData({
// clock: "已经截止"
// });
// //return;
// }
setTimeout(function() {
total_micro_second -= 1000;
countdown(that);
}, 1000)
}

// 时间格式化输出
function dateformaDay(micro_second) {
// 总秒数
var second = Math.floor(micro_second / 1000);
// 天数
var day = Math.floor(second / 3600 / 24);
return day;
}

function dateformaHour(micro_second) {
// 总秒数
var second = Math.floor(micro_second / 1000);
// 小时
var hr = Math.floor(second / 3600 % 24);
return hr;
}

function dateformaMinute(micro_second) {
// 总秒数
var second = Math.floor(micro_second / 1000);
// 分钟
var min = Math.floor(second / 60 % 60);
return min;
}

function dateformaSecondMinute(micro_second) {
// 总秒数
var second = Math.floor(micro_second / 1000);
// 秒
var sec = Math.floor(second % 60);
return sec;
}
var endTime = new Date().getTime() + 24 * 3600 * 1000*4;

Page({

/**
* 页面的初始数据
*/
data: {
headerImgs: postData.postSwiperData,
countDownDay: '',
countDownHour: '',
countDownMinute: '',
countDownSecond: '',
},

/**
* 生命周期函数--监听页面加载
*/
onLoad: function(options) {
var id = options.id; //页面跳转传过来的值
},
onReady: function() {
var that = this;

countdown(that);
}
})

function countdown(that) {
var NowTime = new Date().getTime();
var EndTime = endTime;
var total_micro_second = EndTime - NowTime || [];
console.log('当前时间'+NowTime+'\n剩余时间：' + total_micro_second);
// 渲染倒计时时钟
that.setData({
countDownDay: dateformaDay(total_micro_second),
countDownHour: dateformaHour(total_micro_second),
countDownMinute: dateformaMinute(total_micro_second),
countDownSecond: dateformaSecondMinute(total_micro_second),
});
// if (total_micro_second <= 0) {
// that.setData({
// clock: "已经截止"
// });
// //return;
// }
setTimeout(function() {
total_micro_second -= 1000;
countdown(that);
}, 1000)
}

// 时间格式化输出
function dateformaDay(micro_second) {
// 总秒数
var second = Math.floor(micro_second / 1000);
// 天数
var day = Math.floor(second / 3600 / 24);
return day;
}

function dateformaHour(micro_second) {
// 总秒数
var second = Math.floor(micro_second / 1000);
// 小时
var hr = Math.floor(second / 3600 % 24);
return hr;
}

function dateformaMinute(micro_second) {
// 总秒数
var second = Math.floor(micro_second / 1000);
// 分钟
var min = Math.floor(second / 60 % 60);
return min;
}

function dateformaSecondMinute(micro_second) {
// 总秒数
var second = Math.floor(micro_second / 1000);
// 秒
var sec = Math.floor(second % 60);
return sec;
}wxml


距活动结束还剩

{{countDownDay}}
天
{{countDownHour}}
时
{{countDownMinute}}
分
{{countDownSecond}}
秒





距活动结束还剩

{{countDownDay}}
天
{{countDownHour}}
时
{{countDownMinute}}
分
{{countDownSecond}}
秒


wxss
.time-container {
display: flex;
flex-direction: row;
margin-top: 10px;
margin-bottom: 10px;
margin-right: 10px;
align-items: center;
}

.time-number {
background: white;
color: red;
width: 18px;
height: 18px;
font-size: 12px;
border-radius: 3px;
display: flex;
align-items: center;
justify-content: center;
}

.time-text {
font-size: 10px;
color: white;
margin: 3px;
}
.time-container {
display: flex;
flex-direction: row;
margin-top: 10px;
margin-bottom: 10px;
margin-right: 10px;
align-items: center;
}

.time-number {
background: white;
color: red;
width: 18px;
height: 18px;
font-size: 12px;
border-radius: 3px;
display: flex;
align-items: center;
justify-content: center;
}

.time-text {
font-size: 10px;
color: white;
margin: 3px;
}为大家推荐现在关注度比较高的微信小程序教程一篇：《微信小程序开发教程》小编为大家精心整理的，希望喜欢。《微信小程序开发教程》以上就是本文的全部内容，希望对大家的学习有所帮助。