最新消息:文章中包含代码时,请遵守代码高亮规范!

微信小程序倒计时功能【原创】

JavaScript harbour 245浏览 0评论

最近写小程序,用到一个倒计时功能。自己花了点时间写了一下,还有很多优化的地方。

 

     

    data: {
        hour:"",
        min:"",
        second:"",
        setTime:'2018/03/14 17:07:40',   //可以自己设定
    },

 

 

        
        var that = this;  
        let setTime = that.data.setTime; 
        var endTimes = new Date('2018-03-13 17:50');//结束时间,可以从data里获取数据,自定义+
        var curTimes = new Date();//当前时间 
        var surplusTimes = endTimes.getTime() / 1000 - curTimes.getTime() / 1000;//结束毫秒-当前毫秒=剩余倒计时间
        console.log(surplusTimes);
        var second = parseInt(surplusTimes);
        var min,hour;
        if (second > 60) {
            min = second / 60;
            second = second % 60;
        }else{
            min = 0;
        }
        if (min > 60) {
            hour = min / 60;
            min = min % 60;
        }else{
            hour = 0;
        }
        min = parseInt(min);
        second = parseInt(second);
        hour = parseInt(hour);
        if (second = 0) {
            second = '0' + second;
        }
        if (hour = 0) {
            hour = '0' + hour;
        }
        if (min = 0) {
            min = '0' + min;
        }
        that.setData({
            hour: hour,
            min: min,
            second: second,
        })
        //设置初始倒计时
        var time = setInterval(function(){
            second--;
            if (second =0) {
                second = "0"+second;
            }
            that.setData({
                second:second,
            })
            if(second<1){
                second = 59;
                that.setData({
                    second: 59,
                })    //这里不这么设定就会出现:  02:01  》   01:00   》   01:59  这种bug
                min--;
                if (min = 0) {
                    min = '0' + min;
                }
                if(min>=0){
                    that.setData({
                        min: min,
                    })
                }
                if(min<0){
                    min =59;
                    that.setData({
                        min: 59,
                    })
                    hour --;
                    if (hour = 0) {
                        hour = '0' + hour;
                    }
                    that.setData({
                        hour:hour,
                    })
                    if(hour  endTimes) {
                clearInterval(time);
                that.setData({
                    hour: '00',
                    min:'00',
                    second:'00',
                })
            }
        },1000)

附上小程序自带的转换时间的方法,可以把时间戳转成 0000/00/00 00:00:00的格式

const util = require('../../utils/util.js')   //引入自带的until.js

let time = Date.now();   //获取当前时间

time = util.formatTime(new Date(time))   //转化时间格式 

console.log(time);


转载时请注明出处及相应链接,本文永久地址:https://blog.yayuanzi.com/23490.html


pay_weixin
pay_weixin
微信打赏
pay_weixin
支付宝打赏
感谢您对作者harbour的打赏,我们会更加努力!    如果您想成为作者,请点我

您必须 登录 才能发表评论!