码迷,mamicode.com
首页 > 编程语言 > 详细

[JS]javascript倒计时

时间:2016-01-14 18:48:44      阅读:173      评论:0      收藏:0      [点我收藏+]

标签:

  今天写东西需要用到倒计时,还挺有意思的,就贴出来了,希望能帮到其他人,写的不是很好,希望多提宝贵意见。

HTML代码

<div class="price_time">
    <div>
        <span class="font1">起团价:</span>
        <span class="font2"><span class="font4">¥</span>{$goods.team_price}</span>
        <span class="font3">{$goods.market_price}</span>
    </div>
    <div>
        <span class="font_time">00</span>
        <span class="font_time1">:</span>
        <span class="font_time">00</span>
        <span class="font_time1">:</span>
        <span class="font_time">00</span>
        <span class="font_time1">:</span>
        <span class="font_time">04</span>
    </div>
</div>

 


JS 代码

/**
 * Created by Yu on 16/1/5.
 */
var I = {
    slideIndex: 1,
    slideLength: 0,
    slideT: 0,
    sTime: 2000,
    lastT: 0,
    lTime: 0,
    lDay: {},
    lHour: {},
    lMinutes: {},
    lSeconds: {},
    numFat: function (num) {
        num = num.toString();
        if (num.length == 1) {
            return "0" + num;
        } else {
            return num;
        }
    },
    lastTimeInit: function () {
        //获取倒计时内容
        var i = 0;
        $(".price_time div .font_time").each(function (index, item) {
            console.log(index + ":" + $(item).text());
            switch (i) {
                case 0:
                    I.lDay.obj = $(item);
                    I.lDay.value = $(item).text();
                    break;
                case 1:
                    I.lHour.obj = $(item);
                    I.lHour.value = $(item).text();
                    break;
                case 2:
                    I.lMinutes.obj = $(item);
                    I.lMinutes.value = $(item).text();
                    break;
                case 3:
                    I.lSeconds.obj = $(item);
                    I.lSeconds.value = $(item).text();
                    break;
            }
            i++;
        });
        //开始倒计时
        I.lastT = setInterval(function () {
            // I.lTime++;
            console.log(I.lSeconds.value);
            //
            if (0 == I.lSeconds.value) {
                I.lSeconds.value = 59;
                //
                if (0 == I.lMinutes.value) {
                    I.lMinutes.value = 59;
                    //
                    if (0 == I.lHour.value) {
                        I.lHour.value = 59;
                        //
                        if (0 == I.lDay.value) {
                            //清零
                            I.lSeconds.value = 0;
                            I.lMinutes.value = 0;
                            I.lHour.value = 0;
                            //停止定时器
                            clearTimeout(I.lastT);
                            //隐藏购买按钮
                            $(".buy_button").hide();
                        }
                        else {
                            I.lDay.value--;
                        }
                    } else {
                        I.lHour.value--;
                    }
                } else {
                    I.lMinutes.value--;
                }
            } else {
                I.lSeconds.value--;
            }
            //
            I.lSeconds.obj.text(I.numFat(I.lSeconds.value));
            //
            I.lMinutes.obj.text(I.numFat(I.lMinutes.value));
            //
            I.lHour.obj.text(I.numFat(I.lHour.value));
            //
            I.lDay.obj.text(I.numFat(I.lDay.value));
        }, 1000);
    },
    init: function () {
        //倒计时事件
        I.lastTimeInit();
    }
}
$(function () {
    I.init();
});

 

[JS]javascript倒计时

标签:

原文地址:http://www.cnblogs.com/flyingMonkey/p/5131039.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!