微信小程序中显示倒计时

来源:互联网 发布:怎么找淘宝客服工作 编辑:程序博客网 时间:2024/06/01 22:27

wxml文件中:

  <!--倒计时  -->    <view class="countDownTimeView countDownAllView" >      <view class="voteText countDownTimeText">{{countDownDay}}天</view>      <view class="voteText countDownTimeText">{{countDownHour}}时</view>      <view class="voteText countDownTimeText">{{countDownMinute}}分</view>      <view class="voteText countDownTimeText">{{countDownSecond}}秒</view>    </view>


js文件中:

Page( {  data: {    windowHeight: 654,    maxtime: "",    isHiddenLoading: true,    isHiddenToast: true,    dataList: {},    countDownDay: 0,    countDownHour: 0,    countDownMinute: 0,    countDownSecond: 0,  },  //事件处理函数  bindViewTap: function() {    wx.navigateTo( {      url: '../logs/logs'    })  },  onLoad: function() {    this.setData( {      windowHeight: wx.getStorageSync( 'windowHeight' )    });  },  // 页面渲染完成后 调用  onReady: function () {    var totalSecond = 1505540080 - Date.parse(new Date())/1000;    var interval = setInterval(function () {      // 秒数      var second = totalSecond;      // 天数位      var day = Math.floor(second / 3600 / 24);      var dayStr = day.toString();      if (dayStr.length == 1) dayStr = '0' + dayStr;      // 小时位      var hr = Math.floor((second - day * 3600 * 24) / 3600);      var hrStr = hr.toString();      if (hrStr.length == 1) hrStr = '0' + hrStr;      // 分钟位      var min = Math.floor((second - day * 3600 *24 - hr * 3600) / 60);      var minStr = min.toString();      if (minStr.length == 1) minStr = '0' + minStr;      // 秒位      var sec = second - day * 3600 * 24 - hr * 3600 - min*60;      var secStr = sec.toString();      if (secStr.length == 1) secStr = '0' + secStr;      this.setData({        countDownDay: dayStr,        countDownHour: hrStr,        countDownMinute: minStr,        countDownSecond: secStr,      });      totalSecond--;      if (totalSecond < 0) {        clearInterval(interval);        wx.showToast({          title: '活动已结束',        });        this.setData({          countDownDay: '00',          countDownHour: '00',          countDownMinute: '00',          countDownSecond: '00',        });      }    }.bind(this), 1000);  },  //cell事件处理函数  bindCellViewTap: function (e) {    var id = e.currentTarget.dataset.id;    wx.navigateTo({      url: '../babyDetail/babyDetail?id=' + id    });  }})


效果图:


原创粉丝点击