找回密码
 立即注册

QQ登录

只需一步,快速开始

搜索本站精品资源

首页 教程频道 小程序开发 查看内容

自学系列(零基础学小程序)---小程序实现简单的倒计时

作者:模板之家 2018-1-30 10:00 4176人关注

基本实现功能 1,从60到0的倒计时效果 2,倒计时完毕后 会有提示 先看效果图 其实实现代码很简单 !--index.wxml-- view class=container text倒计时: {{second}} /text /view 下面是相对应得j

基本实现功能
1,从60到0的倒计时效果
2,倒计时完毕后 会有提示
 
先看效果图
2.png1.gif
 
其实实现代码很简单

[JavaScript]
<!--index.wxml-->  

<view class="container">  

 <text>倒计时: {{second}} </text>  

</view>  
下面是相对应得js处理
 [JavaScript] 
//index.js  

// 从从60到到0倒计时  

function countdown(that) {  

 var second = that.data.second  

 if (second == 0) {  

  that.setData({  

   second: "60秒倒计时结束"  

  });  

  return ;  

 }  

 var time = setTimeout(function(){  

  that.setData({  

   second: second - 1  

  });  

  countdown(that);  

 }  

 ,1000)  

}  

   

Page({  

  data: {  

    second: 60  

  },  

  onLoad: function() {  

    countdown(this);  

  }  

});  


路过

雷人

握手

鲜花

鸡蛋
原作者: 模板之家 来自: 网络收集

全部回复(0)