欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

微信小程序動態(tài)顯示項目倒計時

 更新時間:2019年06月20日 16:36:30   作者:Yako元  
這篇文章主要為大家詳細介紹了微信小程序動態(tài)顯示項目倒計時,具有一定的參考價值,感興趣的小伙伴們可以參考一下

本文實例為大家分享了微信小程序動態(tài)顯示項目倒計時的具體代碼,供大家參考,具體內容如下

1、展示的效果如下

2、wxml代碼:

<!--倒計時 -->
<text wx:if="{{clock!=''}}">僅剩{{clock}}</text>
<text wx:if="{{clock==''}}">已經截止</text>

3、js代碼:

在拼團項目中獲取到活動結束時間的格式為一下格式

因該格式無法正常計算時長,所進行了格式轉換new Date(that.data.collage.collage_end).getTime()

// 倒計時
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('時間初始化小于0,活動已結束狀態(tài)');
  total_micro_second = 1;   //單位毫秒 ------ WHY?
 }
 // console.log('剩余時間:' + total_micro_second);
 // 渲染倒計時時鐘
 that.setData({
  clock: dateformat(total_micro_second)  //若已結束,此處輸出'0天0小時0分鐘0秒'
 });
 if (total_micro_second <= 0) {
  that.setData({
   clock: "已經截止"
  });
  return;
 }
 setTimeout(function () {
  total_micro_second -= 1000;
  countdown(that);
 }
  , 1000)
}
 
// 時間格式化輸出,如11天03小時25分鐘19秒 每1s都會調用一次
function 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 + "秒";
}
Page({
  onLoad: function(options) {
    wx.request({
      success: function(request) {
        // 倒計時(獲取結束時間后再進行倒計時方法調用)
        countdown(that);
      }
    })
  }  
})

 以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持腳本之家。

相關文章

  • 微信小程序實現(xiàn)富文本圖片寬度自適應的方法

    微信小程序實現(xiàn)富文本圖片寬度自適應的方法

    小程序里圖片會顯示不全,這時就應該做相應的處理,使小程序里圖片顯示正確,這篇文章主要介紹了微信小程序實現(xiàn)富文本圖片寬度自適應的方法,感興趣的小伙伴們可以參考一下
    2019-01-01
  • js腳本加載失敗問題解決辦法

    js腳本加載失敗問題解決辦法

    在項目中經常會用到動態(tài)加載js,下面這篇文章主要給大家介紹了關于js腳本加載失敗問題的解決辦法,文中通過實例代碼介紹的非常詳細,對大家學習或者使用js具有一定的參考學習價值,需要的朋友可以參考下
    2023-06-06
  • js中async函數結合promise的小案例淺析

    js中async函數結合promise的小案例淺析

    這篇文章主要介紹了js中async函數結合promise的小案例淺析,本文通過實例代碼給大家介紹的非常詳細,具有一定的參考借鑒價值,需要的朋友可以參考下
    2019-04-04
  • 詳解JavaScript中關于this指向的4種情況

    詳解JavaScript中關于this指向的4種情況

    這篇文章主要介紹了JavaScript中關于this指向的4種情況,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧
    2019-04-04
  • 關于JavaScript數組去重的一些理解匯總

    關于JavaScript數組去重的一些理解匯總

    這篇文章主要給大家介紹了關于JavaScript數組去重的一些理解,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧
    2020-09-09
  • 微信小程序自定義多列選擇器使用詳解

    微信小程序自定義多列選擇器使用詳解

    這篇文章主要為大家詳細介紹了微信小程序自定義多列選擇器使用,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2019-06-06
  • js代碼規(guī)范之Eslint安裝與配置詳解

    js代碼規(guī)范之Eslint安裝與配置詳解

    這篇文章主要介紹了js代碼規(guī)范之Eslint安裝與配置詳解,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧
    2018-09-09
  • 解決layui 三級聯(lián)動下拉框更新時回顯的問題

    解決layui 三級聯(lián)動下拉框更新時回顯的問題

    今天小編就為大家分享一篇解決layui 三級聯(lián)動下拉框更新時回顯的問題,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧
    2019-09-09
  • javascript刷新父頁面方法匯總詳解

    javascript刷新父頁面方法匯總詳解

    這篇文章主要介紹了javascript刷新父頁面方法匯總詳解,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下
    2019-10-10
  • javascript中xml操作實現(xiàn)代碼

    javascript中xml操作實現(xiàn)代碼

    好久沒寫了。感覺今時今日,HTML5 還依然只是一種玩票的東東。但愿 w3c 的標準可以早一點出臺,不要讓各種瀏覽器的兼容問題和支持程度搞死
    2011-11-11

最新評論