PHP倒计时,每隔30秒同步一次服务器时间

<?php

$act  = $_REQUEST['act'];
if($act == 'time') {
    //echo time();
    echo date('Y-m-d H:i:s');
    exit;
}

?>
<!doctype html>
<html>
 <head>
  <title>抢购微路由工程机,倒计时</title>
  <meta name="keywords" content="抢购微路由工程机,智能路由器领导品牌" />
  <meta name="description" content="抢购微路由工程机,智能路由器领导品牌" />
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <meta name="viewport" content="width=device-width">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <script src="/js/jquery-1.4.2.min.js"></script>
 </head>
 <body>
     <h2>商品1 </h2>  
     <p class="buy_time" endTime="2014-03-24 11:40:00">  
         离抢购时间:<br />  
         <b>0</b>天<b>0</b>小时<b>0</b>分<b>0.0</b>秒  
         <input type="button" class="btn" value="即将开始"  />   
     </p>
     <h2>商品2</h2>  
     <p class="buy_time" endTime="2013-10-25 18:10:45">  
         离抢购时间:<br />  
         <b>0</b>天<b>0</b>小时<b>0</b>分<b>0.0</b>秒  
         <input type="button" class="btn" value="即将开始"  />   
     </p>  
       
     <h2>商品3</h2>  
     <p class="buy_time" endTime="2014-5-25 18:10:45">  
         离抢购时间:<br />  
         <b>0</b>天<b>0</b>小时<b>0</b>分<b>0.0</b>秒  
         <input type="button" class="btn" value="即将开始"  />   
     </p>  
     
<script type="text/javascript">  
var sysTime = '<?php echo date('Y-m-d H:i:s');?>';    //服务器时间
$(document).ready(function() {  
    //初始化所有的抢购计数器  
    $(".buy_time").each(function(i) {  
        var endTime = $(this).attr("endTime");    //结束时间
        $(this).clock(endTime, callback);         //倒计时
    });
    setInterval(getSystemTime, 30000);            //每5分钟请求获取服务器时间  
});  
</script>  
<script>
//倒计时  
$.fn.clock = function(endTime, callback) {  
    this.each(function() {  
        var _this = this,  
            _time = {},  
            _sysTime = '',  
        getMS = function(s) {  
            var t = getStrTime(s);  
            return new Date(t.YY, t.MM - 1, t.DD, t.hh, t.mm, t.ss).getTime();  
        },  
        getRS = function() {  
            if (_sysTime != sysTime) {  
                _sysTime = sysTime;  
                return getMS(endTime) - getMS(sysTime);  
            } else {
                return _time.rs - 100;  
            }
        },  
        countDown = function() {
            _time.rs = getRS();  
            if (_time.rs >= 0) {  
                _time.dd = Math.floor(_time.rs / 1000 / 60 / 60 / 24);  
                _time.hh = Math.floor(_time.rs / 1000 / 60 / 60 % 24);  
                _time.mm = Math.floor(_time.rs / 1000 / 60 % 60);  
                _time.ss = Math.floor(_time.rs / 1000 % 60);  
                _time.ds = Math.floor(_time.rs / 100 % 10);  
       
                $(_this).find("b").eq(0).html(_time.dd);  
                $(_this).find("b").eq(1).html(_time.hh);  
                $(_this).find("b").eq(2).html(_time.mm);  
                $(_this).find("b").eq(3).html(_time.ss + "." + _time.ds);  
            }  
            callback.call(_this, _time);  
            if (_time.rs <= 0) {  
                clearTimeout($(_this).data('clock_timer'));  
            }  
            else {  
                $(_this).data('clock_timer', setTimeout(countDown, 100));  
            }  
        };  
        clearTimeout($(_this).data('clock_timer'));  
        countDown();  
    });  
};  
       
function getStrTime(s) {  
    var a = s.split(' '),  
        d = a[0].split('-'),  
        t = a[1].split(':');  
    return {  
        YY: d[0],  
        MM: d[1],  
        DD: d[2],  
        hh: t[0],  
        mm: t[1],  
        ss: t[2]  
    };  
}  
//请求服务器时间  
function getSystemTime() {  
    $.ajax({  
        url: '/huodong/huodong3.php?act=time&r=' + Math.random(),  
        type: "get",  
        dataType: "text",  
        success: function(result) {  
            sysTime = result;  
        }
    });  
}
//回调方法  
function callback(time) {
    if (time.rs < 0) {  
        $(this).find(".btn").val("已经结束").unbind();
    }  
    else if (time.rs == 0) {  
        $(this).find(".btn").val("马上抢购").unbind().click(function() { alert("恭喜,成功抢购!") });  
    }  
    else if (time.rs <= 30000) {  
        $(this).find(".btn").val(time.ss + "." + time.ds + "秒");  
    }  
}
</script>
 </body>
</html>

使用时请注意商品标签上的endTime。

300*300
 文章首页关于迷茫时代关于我写意人生
版权所有:迷茫时代 All rights reserved   
执行时间:0.00534 秒