本文實(shí)例為大家分享了微信小程序動(dòng)態(tài)顯示項(xiàng)目倒計(jì)時(shí)的具體代碼,供大家參考,具體內(nèi)容如下
1、展示的效果如下
2、wxml代碼:
<!--倒計(jì)時(shí) --><text wx:if="{{clock!=''}}">僅剩{{clock}}</text><text wx:if="{{clock==''}}">已經(jīng)截止</text>
3、js代碼:
在拼團(tuán)項(xiàng)目中獲取到活動(dòng)結(jié)束時(shí)間的格式為一下格式
因該格式無(wú)法正常計(jì)算時(shí)長(zhǎng),所進(jìn)行了格式轉(zhuǎn)換new Date(that.data.collage.collage_end).getTime()
// 倒計(jì)時(shí)function countdown(that) { var EndTime = new Date(that.data.collage.collage_end).getTime() || []; // console.log(EndTime); var NowTime = new Date().getTime(); var total_micro_second = EndTime - NowTime || []; //單位毫秒 if (total_micro_second < 0) { // console.log('時(shí)間初始化小于0,活動(dòng)已結(jié)束狀態(tài)'); total_micro_second = 1; //單位毫秒 ------ WHY? } // console.log('剩余時(shí)間:' + total_micro_second); // 渲染倒計(jì)時(shí)時(shí)鐘 that.setData({ clock: dateformat(total_micro_second) //若已結(jié)束,此處輸出'0天0小時(shí)0分鐘0秒' }); if (total_micro_second <= 0) { that.setData({ clock: "已經(jīng)截止" }); return; } setTimeout(function () { total_micro_second -= 1000; countdown(that); } , 1000)} // 時(shí)間格式化輸出,如11天03小時(shí)25分鐘19秒 每1s都會(huì)調(diào)用一次function dateformat(micro_second) { // 總秒數(shù) var second = Math.floor(micro_second / 1000); // 天數(shù) var day = Math.floor(second / 3600 / 24); // 小時(shí) var hr = Math.floor(second / 3600 % 24); // 分鐘 var min = Math.floor(second / 60 % 60); // 秒 var sec = Math.floor(second % 60); return day + "天" + hr + "小時(shí)" + min + "分鐘" + sec + "秒";}Page({ onLoad: function(options) { wx.request({ success: function(request) { // 倒計(jì)時(shí)(獲取結(jié)束時(shí)間后再進(jìn)行倒計(jì)時(shí)方法調(diào)用) countdown(that); } }) } })
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持武林網(wǎng)。
新聞熱點(diǎn)
疑難解答
圖片精選
網(wǎng)友關(guān)注