js倒計時效果,傳入時間2019-07-30 10:20:00輸出xx天xx小時xx分鐘xx秒

微信小程序開發交流微信羣 ↓ 掃碼入羣,備註微信小程序
在這裏插入圖片描述

承接微信小程序開發。掃碼加微信。


效果圖

在這裏插入圖片描述

倒計時,主要應用於活動倒計時

當前時間:2019-07-29 10:56:00

//時間傳活動截止時間
const app = getApp();
Page({
	data:{
		currentTime:''
	},
	onLoad(){
		app.countdown(this,'2019-07-30 10:20:00');
		console.log(this.data.currentTime);
	},
	onUnload(){
		//關閉頁面時記得手動清除定時器
		app.closeinterval();
	}
})

//輸出  0天23小時23分鐘48秒

app.js

countdown(that, end_time) {
	let app = this;
    let EndTime = new Date(end_time);
    EndTime = EndTime.getTime()
    let NowTime = new Date().getTime();
    let total_micro_second = EndTime - NowTime || [];
    // 渲染倒計時時鐘
    that.setData({
      currentTime: this.dateformat(total_micro_second)
    });
    if (total_micro_second <= 0) {
      that.setData({
        currentTime: "已經截止"
      });
      clearInterval(timer)
      return;
    }
    timer = setTimeout(function() {
      total_micro_second -= 1000;
      app.countdown(that, end_time);
    }, 1000)
  },
  //清除定時器
  closeinterval() {
    clearInterval(timer)
  },
  // 時間格式化輸出,如11:03 25:19 每1s都會調用一次
  dateformat(micro_second) {
    //總秒數
    var second = Math.floor(micro_second / 1000);
    // 天數
    var day = Math.floor(second / 3600 / 24);
    // 小時
    var hr = Math.floor(second / 3600 % 24);
    //分鐘
    var min = Math.floor(second / 60 % 60);
    // 秒
    var sec = Math.floor(second % 60);
    return day + "天" + hr + "小時" + min + "分鐘" + sec + "秒";
  },
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章