小程序倒计时wxml与js

所属栏目:建站技术 更新时间:2020-10-30 点击: 文章来源:/jzjs/3515.html

小程序倒计时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 = Date.parse(new Date())/1000+10 - 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);
  },
})


小程序倒计时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>


相关阅读

中英文混和的字符串的ASCII与UNICODE编码与解码

//1:获取中英文混合字符的编码(ASCII码与UNICODE码)$str=&quot;官网制作:网巢网络&quot;;foreach(math($str)as$key=&gt;$value){if(preg_match(&#39;/^[x{4e00}-x{9fa5}]+$/u&#39;,$value)){//中文,注意中文这里暂时不转换,因为无法通过chr…

了解详情 >>

用火狐打开百度一直加载s1.bdstatic.com的解决办法

一直用火狐浏览器,火狐浏览器插件多,很合适网页开发人员使用,以前一直用的好好的,但是今天使用的时候突然发现没有以前好用了,打开百度的官网一直很卡,通过FIREBGU发现在打开百度官网的时候一直会加载s1.bdstatic.com这个网站,无语,怎么打开百度的官网还需要链接s1.bdstatic.com这个网站这个网站吗?难道是百度被黑了,或者是自己的浏览器被…

了解详情 >>

正则表达式收集汇总

搜索:empty(($)tr[&#39;([a-z]{1,})&#39;]),可以查找这样的empty($tr[&#39;digest&#39;]),然后可以替换成!$digest替换:!$1$2匹配A标签的超连接的正则表式如下$pattern=&quot;/&lt;a[^&gt;]+?href=[&quot;&#39;]?([^&quot;&#39;]+)…

了解详情 >>

小程序的下单与支付的业务流程

1:小程序携带商品信息调用第三方服务器的下单API2:第三方服务器下单API对小程序带来的商品作库存量检测3:如果检测通过,第三方服务器就会保存这个订单并且告之小程序下单成功4:小程序调用第三方服务器的支付api5:第三方服务器API调用微信的预订单API[WxPayApi::unifiedOrder](注意第三方服务器是无法完成支付的,这个订单实际是在微信…

了解详情 >>

为什么小程序的页面有二次跳转时会瞬间显示一下第一次的页面再跳转呢?

为什么小程序的页面有二次跳转时会瞬间显示一下第一次的页面再跳转呢?navigateToredirectToswitchTabtabBar先来看示例代码并且在微信开发者工具上测试下面看示例代码共有三个页面,分别是indexproductshowcartindex的js与wxmlPage({/*跳转到商品详情*/toProductshow:function(ev…

了解详情 >>

如何解决QQ显示未启用的问题

没设置临时会话,一般都会出现下面的状况。QQ放在网站上作为客服,必须设置临时会话。或者点击之后,要求加为好友才可以对话。解决这个问题的步骤如下:一、登陆腾讯官方网站:http://wp.qq.com/二、登陆之后,点“设置”,按下图所示,全部打勾。这个必须设置,不设置,不能临时会话,就会显示“未启用”。这一步是关键,必须设置。(1)先看服务有没被停用:如停用…

了解详情 >>

Copyright @ 2008-2019   www.sznest.net   All rights reserved  网巢网是一家专业为企业提供免费建站、自助建站的模板建站公司     友情链接:

微信

移动端

客服

顶部