[jQuery] 倒數計時(還有X天X時X分X秒)

Standard

jQuery 倒數計時, 需要 jQuery.Timers 這個 plugin.
startDate 可以用 server 的時間輸出, 避免 client 的電腦時間不準。

<script type='text/javascript' src='http://www.google.com/jsapi'></script>
<script type='text/javascript' language='javascript'>
  google.load('jquery', '1.4.3');
</script>
<script src='jquery.timers-1.2.js' type='text/javascript'></script>
<script type='text/javascript'>
  var startDate = new Date('2010/11/11 08:00');
  var endDate = new Date('2010/11/15 23:00');
  var spantime = (endDate - startDate)/1000;

  $(document).ready(function () {
    $(this).everyTime('1s', function(i) {
       spantime --;
       var d = Math.floor(spantime / (24 * 3600));
       var h = Math.floor((spantime % (24 * 3600)) / 3600);
       var m = Math.floor((spantime % 3600) / (60));
       var s = Math.floor(spantime % 60);

      if (spantime > 0) {
        $('#hour').text(h + (d*24));
        $('#min').text(m);
        $('#sec').text(s);
      } else { // 避免倒數變成負的
        $('#hour').text(0);
        $('#min').text(0);
        $('#sec').text(0);
      }
    });
  });
</script>

還有:
<div id="hour"></div>
時
<div id="min"></div>
分
<div id="sec"></div>
秒

ref: http://topic.csdn.net/u/20080323/13/50787be4-7502-4246-b609-470c9e9a650c.html

2 thoughts on “[jQuery] 倒數計時(還有X天X時X分X秒)

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *