要求要有小時分鐘秒的即時倒計時的顯示,使用者端修改日期時間不會影響到倒計時的正常顯示(也就是以伺服器時間為準)。
其實這和很多的考試等系統的時間限制功能同樣的要求。
總不能用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>