オーダーのカウントダウン機能を実現するマイクロ手紙アプレットのソースコード

効果：

 

 

特に指定しない限り、関数は、それは、難しいだけで退屈なポイントではありません、コードが直接行過去のすべての棒のために有用である直接コード、上の誰もが。

wxml：

<ビュークラス= "countdownBox"> 
   <テキスト>结束倒计时</テキスト> 
   <ビュークラス= "項目"> {{countdown.day}} </ビュー> 
   <テキスト>天</テキスト> 
   <ビュークラス=」項目"> {{countdown.hour}} </ビュー> 
   <テキスト>时</テキスト> 
   <ビュークラス="項目"> {{countdown.minute}} </ビュー> 
   <テキスト>分</テキスト> 
   <ビュークラス= "項目"> {{countdown.second}} </ビュー> 
   <テキスト>秒</テキスト> 
</ビュー>

　　

wxss：

.countdownBox { 
  幅：100％。
  高さ：80rpx。
  背景色：赤。
  国境半径：50rpx。
  マージントップ：20rpx。
  表示：フレックス。
  正当化-コンテンツ：センター; 
  ALIGN-アイテム：センター; 
  色：#FFF; 
  フォントサイズ：30rpx。
  マージン下：20rpx。
} 
.countdownBox .item { 
  高さ：60rpx。
  背景色：#FFF; 
  色：＃000; 
  ボックスサイズ：ボーダーボックス; 
  パディング：0rpx 8rpx。
  表示：フレックス。
  正当化-コンテンツ：センター; 
  ALIGN-アイテム：センター; 
  フォントサイズ：35rpx。
  フォント重量：480; 
  マージン：0rpx 10rpx。
}

　　

JS：

ページ（{ 
  データ：{ 
    カウントダウン：{ 
      日： '' 
      時間'' 
      分''、
      第二'' 
    } 
  }、

　　

//开始
  startCountdown：関数（SERVERTIME、endTimeは）{ 
    VARこの=。
    SERVERTIME =新しいDate（SERVERTIME）。
    VARミリ秒= endTime.getTime（） - serverTime.getTime（）。
    
    VAR間隔=たsetInterval（関数（）{ 
      にconsole.log（ '循环中'）; 
      ミリ秒- = 1000; 
      IF（ミリ秒<= 0）{ 
        てclearInterval（インターバル）; 
        that.setData（{ 
          カウントダウン：{ 
            日： '00' 、
            時間： '00'、
            分： '00'、
            第二'00' 
          } 
        }）; 
        リターン; 
      } 
      that.transformRemainTime（ミリ秒）。 
    }、1000）。
  }、 
  //変換時間のミリ秒単位の時間（）残り
  transformRemainTime：関数（ミリ秒）{ 
    VARを=、この; 
    VAR = countdownObj that.data.countdown; 
    //秒
    VAR秒= Math.floor（ミリ秒/ 1000 ）; 
    //日数
    countdownObj.day = that.formatTime（Math.floor（秒/ 24分の3600））; 
    // H 
    countdownObj.hour = that.formatTime（Math.floor（秒/ 24％3600））; 
    //分
    countdownObj.minute = that.formatTime（Math.floor（秒/ 60％60））; 
    //第
    countdownObj.second = that.formatTime（Math.floor（秒60％））; 
    that.setData（{ 
      COUNTDOWN：countdownObj 
    }）; 
  } 
  //フォーマットされた時間2
  FORMATTIME：関数（時間）{ 
    IF（時間<10）
      リターン'0' +時間; 
    時間を返します。
  }、

　　

SERVERTIME私がここに持っている小さなプログラム可能なクラウドサーバー時間で、endTimeはカウントダウン時間、ライン上の日、時間、分、秒に2間の差です。

 

完全なコードをダウンロード：  イベントの登録は、マイクロ文字のアプレットアプレット-ヘーゼルナッツアプリケーション市場を