比如要做一個限時購物的功能,這就要做到倒計時,要有實時的倒計時。
要求要有小時分鐘秒的實時倒計時的顯示,用戶端修改日期時間不會影響到倒計時的正常顯示(也就是以服務器時間為准)。
其實這和很多的考試等系統的時間限制功能同樣的要求。
總不能用ajax每秒都獲取服務器時間吧,所以實時倒計時一定要用javascript實現。這很簡單,網上一大把的例子。
現在問題是解決用戶端修改日期時間對我們的顯示的影響。
解決的辦法是計算出用戶端的時間和服務器的時間差,這樣問題的完成解決了。
這樣只需要運行一次php,實時倒計時的時間就和服務器的時間同步了。
理論是同步的,但實際測試會有1秒的誤差。(具體原因就是和網速有關,網速越快,誤差就越小),但這決不會影響到我們上面的要求了。
注:秒殺時間從早上點到晚上10點。
Code 如下:
<?php //php的時間是以秒算。js的時間以毫秒算 date_default_timezone_set('PRC'); //date_default_timezone_set("Asia/Hong_Kong");//地區 //配置每天的活動時間段 $starttimestr = "08:00:00"; $endtimestr = "22:00:00"; $starttime = strtotime($starttimestr); $endtime = strtotime($endtimestr); $nowtime = time(); if ($nowtime<$starttime){ die("活動還沒開始,活動時間是:{$starttimestr}至{$endtimestr}"); } $lefttime = $endtime-$nowtime; //實際剩下的時間(秒) ?> <script language="JavaScript"> <!-- // var runtimes = 0; function GetRTime(){ var nMS = <?=$lefttime?>*1000-runtimes*1000; var nH=Math.floor(nMS/(1000*60*60))%24; var nM=Math.floor(nMS/(1000*60)) % 60; var nS=Math.floor(nMS/1000) % 60; document.getElementById("RemainH").innerHTML=nH; document.getElementById("RemainM").innerHTML=nM; document.getElementById("RemainS").innerHTML=nS; if(nMS>5*59*1000&&nMS<=5*60*1000) { alert("還有最後五分鐘!"); } runtimes++; setTimeout("GetRTime()",1000); } window.onload=GetRTime; // --> </script> <h4><strong id="RemainH">XX</strong>:<strong id="RemainM">XX</strong>:<strong id="RemainS">XX</strong></h4>