微信小程序實現(xiàn)倒計時補零功能
更新時間：2018年07月09日 14:21:31 作者：司小文
這篇文章主要為大家詳細介紹了微信小程序實現(xiàn)倒計時補零功能，具有一定的參考價值，感興趣的小伙伴們可以參考一下
微信小程序中 "倒計時自動補零" 的一點代碼，方法比較簡單粗暴，想著以后怎么也能用到，就先總結出來了。
代碼：
js：
//index.js
var num = 10//計時
var strH = ''
var strM = ''
var strS = ''
var timer = ''
Page({
data: {
timeText:''//展示
},
onLoad: function () {
this.move()
//計時開始 后面的1000是毫秒 每1000毫秒跳一次
timer=setInterval(this.move,1000);
},
move(){
//時
strH = this.zeroFill(''+parseInt(num/3600%24),2)
//分
strM = this.zeroFill(''+parseInt(num/60%24),2)
//秒
strS = this.zeroFill(''+parseInt(num%60),2)
//賦值給text內容
this.setData({
timeText:strH+':'+strM+':'+strS
})
//當時間歸零停止計時器
if (num == 0){
clearInterval(timer)
return
}
//每秒遞減
num--
},
zeroFill(str, n){
//補零方法，str為數(shù)字字符串 n為需要的位數(shù)，不夠補零
if (str.length < n){
str = '0'+str
}
return str
}
})
wxml：
<text>{{timeText}}</text>
以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持腳本之家。
相關文章
JavaScript方法_動力節(jié)點Java學院整理
這篇文章主要介紹了JavaScript方法，詳細的介紹了JavaScript幾種函數(shù)定義方式及使用方法,感興趣的小伙伴們可以參考一下2017-06-06
javaScript如何跳出多重循環(huán)break、continue
這篇文章主要為大家詳細介紹了javaScript如何跳出多重循環(huán)break、continue，具有一定的參考價值，感興趣的小伙伴們可以參考一下2016-09-09
JS使用window.requestAnimationFrame()對列表切片進行渲染
這篇文章主要為大家介紹了JS使用requestAnimationFrame對列表切片進行渲染，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2023-05-05
下面小編就為大家?guī)硪黄仙Ｕ凧avaScript面向對象基礎與this指向問題。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-10-10
這篇文章主要教大家學習使用Bootstrap頁面排版樣式，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-05-05
這篇文章主要介紹了小程序分享鏈接onShareAppMessage的具體用法，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2020-05-05
下面小編就為大家?guī)硪黄粋€簡單不報錯的summernote圖片上傳案例。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-07-07
uniapp小程序使用高德地圖api實現(xiàn)路線規(guī)劃的示例代碼
路線規(guī)劃常用于出行路線的提前預覽，我們提供4種類型的路線規(guī)劃，分別為：駕車、步行、公交和騎行，滿足各種的出行場景，這篇文章主要介紹了uniapp小程序使用高德地圖api實現(xiàn)路線規(guī)劃,需要的朋友可以參考下2023-01-01
window.showModalDialog參數(shù)傳遞中含有特殊字符的處理方法
程序運行出錯經(jīng)，過檢查發(fā)現(xiàn)傳遞的數(shù)據(jù)中出現(xiàn)了#等特殊字符，瀏覽器只取到#號前面的數(shù)據(jù)，后面的被截斷，下面為大家介紹下正確的處理方法2013-06-06
這篇文章主要為大家詳細介紹了JavaScript實現(xiàn)年歷效果，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-08-08