微信小程序> 微信小程序倒计时

微信小程序倒计时

浏览量:2013 时间: 来源:mossbaoo

倒计时适用于很多场景,先mark下来,以备之后的一时之用吧

 

以下案例是24小时的倒计时

wxml:

view倒计时 {{countHour}}:{{countMinute}}:{{countSecond}}/view

js:

data: {  countDay: null,  countHour: null,  countMinute: null,  countSecond: null,},onReady: function () {  this.setData({    countDay: '00',    countHour: '24',    countMinute: '00',    countSecond: '00',  });  // 设置开始时间,1天=86400秒  var totalSecond = 86400 - 1;   // 设置定时器  var timeInterval = setInterval(function () {    // 天    var day = Math.floor(totalSecond / 3600 / 24);    if (day  10) day = '0' + day;    // 时    var hour = Math.floor((totalSecond - day * 3600 * 24) / 3600);    if (hour  10) hour = '0' + hour;    // 分    var minute = Math.floor((totalSecond - day * 3600 *24 - hour * 3600) / 60);    if (minute  10) minute = '0' + minute;    // 秒    var second = totalSecond - day * 3600 * 24 - hour * 3600 - minute*60;    if (second  10) second = '0' + second;    this.setData({      countDay: day,      countHour: hour,      countMinute: minute,      countSecond: second,    });    totalSecond--;    if (totalSecond  0) {      clearInterval(timeInterval);      wx.showToast({        title: '倒计时结束',      });      this.setData({        countDay: '00',        countHour: '00',        countMinute: '00',        countSecond: '00',      });    }  }.bind(this), 1000);},

 

版权声明

即速应用倡导尊重与保护知识产权。如发现本站文章存在版权问题,烦请提供版权疑问、身份证明、版权证明、联系方式等发邮件至197452366@qq.com ,我们将及时处理。本站文章仅作分享交流用途,作者观点不等同于即速应用观点。用户与作者的任何交易与本站无关,请知悉。

产品经理

手机 : 13312967497

擅长 : 小程序流量变现

扫码领取礼包

热门模板

  • 头条
  • 搜狐
  • 微博
  • 百家
  • 一点资讯
  • 知乎