微信小程序?qū)崿F(xiàn)倒計(jì)時(shí)補(bǔ)零功能

更新時(shí)間：2018年07月09日 14:21:31 作者：司小文

這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)倒計(jì)時(shí)補(bǔ)零功能，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下

微信小程序中 "倒計(jì)時(shí)自動補(bǔ)零" 的一點(diǎn)代碼，方法比較簡單粗暴，想著以后怎么也能用到，就先總結(jié)出來了。

代碼：

js：

//index.js
var num = 10//計(jì)時(shí)
var strH = ''
var strM = ''
var strS = ''
var timer = ''
 
Page({
 data: {
  timeText:''//展示
 },
 
 onLoad: function () {
  this.move()
  //計(jì)時(shí)開始 后面的1000是毫秒 每1000毫秒跳一次
  timer=setInterval(this.move,1000);
 },
 
 move(){
  //時(shí)
  strH = this.zeroFill(''+parseInt(num/3600%24),2)
 
  //分
  strM = this.zeroFill(''+parseInt(num/60%24),2)
 
  //秒
  strS = this.zeroFill(''+parseInt(num%60),2)
 
  //賦值給text內(nèi)容
  this.setData({
   timeText:strH+':'+strM+':'+strS
  })
   
  //當(dāng)時(shí)間歸零停止計(jì)時(shí)器
  if (num == 0){
    clearInterval(timer)
    return
  }
 
  //每秒遞減
  num--
 },
 zeroFill(str, n){
  //補(bǔ)零方法，str為數(shù)字字符串 n為需要的位數(shù)，不夠補(bǔ)零
  if (str.length < n){
   str = '0'+str
  }
  return str
 }
})

wxml：

<text>{{timeText}}</text>

以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

javascript實(shí)現(xiàn)數(shù)字時(shí)鐘效果
這篇文章主要為大家詳細(xì)介紹了javascript實(shí)現(xiàn)數(shù)字時(shí)鐘效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2021-02-02
JS實(shí)現(xiàn)標(biāo)簽頁效果(配合css)
實(shí)現(xiàn)的效果是當(dāng)鼠標(biāo)移到某一個(gè)標(biāo)簽的時(shí)候，在下面的內(nèi)容區(qū)顯示對應(yīng)的內(nèi)容，并且相應(yīng)標(biāo)簽的顏色需要改變,這樣的效果是CSS和JS配合實(shí)現(xiàn)的,下面我們就來看看具體代碼
2013-04-04
JS實(shí)現(xiàn)雙擊內(nèi)容變?yōu)榭删庉嫚顟B(tài)
在一些網(wǎng)站上我們經(jīng)常看到交互性很強(qiáng)的功能。一些用戶資料可以直接雙擊出現(xiàn)文本框，并在此輸入新的資料即可修改，無需再按確定按鈕等。怎么實(shí)現(xiàn)的呢？今天小編給大家分享JS實(shí)現(xiàn)雙擊內(nèi)容變?yōu)榭删庉嫚顟B(tài)，需要的的朋友參考下
2017-03-03
微信小程序?qū)崿F(xiàn)登錄注冊功能
這篇文章主要介紹了微信小程序?qū)崿F(xiàn)登錄注冊功能，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2020-12-12
20行js代碼實(shí)現(xiàn)的貪吃蛇小游戲
曾經(jīng)諾基亞的貪吃蛇風(fēng)靡一時(shí)，在游戲匱乏的年代，用Java實(shí)現(xiàn)太難，現(xiàn)在網(wǎng)頁制作20行代碼就做成一個(gè)簡單的demo了，下面這篇文章主要給大家介紹了利用20行js代碼實(shí)現(xiàn)的貪吃蛇小游戲，需要的朋友可以參考借鑒，下面來一起看看吧。
2017-06-06
怎樣用JavaScript實(shí)現(xiàn)原型模式
這篇文章主要介紹了怎樣用JavaScript實(shí)現(xiàn)原型模式，想學(xué)習(xí)設(shè)計(jì)模式的同學(xué)，可以參考下
2021-04-04
JS實(shí)現(xiàn)div居中示例
div居中的方法有很多，網(wǎng)上可以找得到，但是本文要介紹的是使用JS實(shí)現(xiàn)的，比較另類，大家不妨參考下
2014-04-04
基于JavaScript實(shí)現(xiàn)每日簽到打卡軌跡功能
這篇文章主要為大家詳細(xì)介紹了基于JavaScript實(shí)現(xiàn)每日簽到打卡軌跡功能，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2018-11-11
JavaScript中深拷貝與淺拷貝詳解
大家好，本篇文章主要講的是JavaScript中深拷貝與淺拷貝詳解，感興趣的同學(xué)趕快來看一看吧，對你有幫助的話記得收藏一下
2022-02-02
ES6中Array.find()和findIndex()函數(shù)的用法詳解
ES6為Array增加了find()，findIndex函數(shù)。find()函數(shù)用來查找目標(biāo)元素，找到就返回該元素，找不到返回undefined，而findIndex()函數(shù)也是查找目標(biāo)元素，找到就返回元素的位置，找不到就返回-1。下面通過實(shí)例詳解，需要的朋友參考下吧
2017-09-09