论坛 › Web开发 › 一个页面的倒计时代码

中关村村草 发表于 2011-12-14 21:23

一个页面的倒计时代码

一个页面的倒计时代码












Js代码1.js:Js代码1.$(function(){   
2.//====倒计时====   
3.      var timePush = {},timeId,STATIC = {'0':'h','1':'m','2':'s'},items = $(".items-prod li");   
4.      $(".time-left", items).each(function(index, callback) {   
5.            timePush["T" + index] = returnTime.call(this);   
6.      });   
7.   
8.      timeId = setTimeout(function() {   
9.            if (isEmptyObj.call(timePush)) {   
10.                clearTimeout(timeId);   
11.                return false;   
12.            }   
13.            //提前预定 处理   
14.            timeId = setTimeout(arguments.callee, 1000);   
15.            //处理   
16.            $.each(timePush, function(index, callback) {   
17.                //递归获取更新后的时间   
18.                var timeItem = getTime(this, 2);   
19.                if (timeItem.join("") - 0 == 0) {   
20.                  deleteTime(index);   
21.                } else {   
22.                  updateTime(index, timeItem);   
23.                }   
24.            });   
25.      }, 1);   
26.   
27.      function getTime(arr, type, pre) {   
28.            if (type < 0)return 0;   
29.            var num = _numTmp = ~~arr,_type = STATIC["" + type];   
30.            switch (_type) {   
31.                case 'h':   
32.                  --num < 0 ? pre = 0 : num;   
33.                  break;   
34.                case 'm':   
35.                  num = fixed2Str(--num < 0 ? getTime(arr, type - 1, 59) : num);   
36.                  pre = ~~arr || _numTmp ? pre : 0;   
37.                  arr = num;   
38.                  break;   
39.                case 's':   
40.                  arr = fixed2Str(--num < 0 ? getTime(arr, type - 1, 59) : num);   
41.                  break;   
42.                default:   
43.                  break;   
44.            }   
45.            if (pre != void 0)return pre;   
46.            return arr;   
47.      }   
48.   
49.      function updateTime(key, arr) {   
50.            var index = key.replace(/[^\d]/g, ''),str = arr.join("").split("");   
51.            $(".time-left", items.eq(index)).find("span i").each(function(index) {   
52.                this.innerHTML = str;   
53.            })   
54.      }   
55.   
56.      function deleteTime(key) {   
57.            var index = key.replace(/[^\d]/g, '');   
58.            delete timePush;   
59.            $(".reply-btn", items.eq(index)).attr("class", "submit-btn disabled-big").html('<span><em></em>已经结束</span>');   
60.            $(".time-left", items.eq(index)).find("span i").html(0);   
61.      }   
62.   
63.      function isEmptyObj() {   
64.            for (var i in this)return false;   
65.            return true;   
66.      }   
67.   
68.      function fixed2Str(number) {   
69.            if (number < 10)number = "0" + number;   
70.            return "" + number;   
71.      }   
72.   
73.      function returnTime() {   
74.            var time = [];   
75.            $("span", this).each(function() {   
76.                time.push($(this).text());   
77.            });   
78.            return time;   
79.      }   
80.});    html:



Html代码1.<div class="time-leave">   
2.                  <span class="fl">剩余时间：</span>   
3.   
4.                  <div class="time-left fl"><p>   
5.                        <span><i>0</i><i>0</i></span><span><i>3</i><i>6</i></span><span><i>3</i><i>9</i></span></p>   
6.                  </div>   
7.                </div>   

蓝猫淘气啦啦 发表于 2011-12-20 13:59

谢谢楼主

查看完整版本: 一个页面的倒计时代码