- 相關(guān)推薦
php實(shí)時(shí)倒計(jì)時(shí)功能實(shí)現(xiàn)方法詳解
文章主要介紹了php實(shí)時(shí)倒計(jì)時(shí)功能實(shí)現(xiàn)方法,結(jié)合具體實(shí)例形式分析了php結(jié)合前臺(tái)JS的時(shí)間戳操作實(shí)現(xiàn)倒計(jì)時(shí)功能的具體步驟與相關(guān)操作技巧,需要的朋友可以參考下.
這幾天公司要做一個(gè)限時(shí)購(gòu)物的功能.這就要做到倒計(jì)時(shí),要有實(shí)時(shí)的倒計(jì)時(shí).
要求:
1) 要有小時(shí)分鐘秒的實(shí)時(shí)倒計(jì)時(shí)的顯示
2)用戶(hù)端修改日期時(shí)間不會(huì)影響到倒計(jì)時(shí)的正常顯示(也就是以服務(wù)器時(shí)間為準(zhǔn))
其實(shí)這和很多的考試等系統(tǒng)的時(shí)間限制功能同樣的要求.
解決思路:
1)總不能用ajax每秒都獲取服務(wù)器時(shí)間吧.
所以實(shí)時(shí)倒計(jì)時(shí)一定要用javascript實(shí)現(xiàn).這很簡(jiǎn)單.網(wǎng)上一大把的例子.
2)現(xiàn)在問(wèn)題是解決用戶(hù)端修改日期時(shí)間對(duì)我們的顯示的影響.
解決的辦法是計(jì)算出用戶(hù)端的時(shí)間和服務(wù)器的時(shí)間差.這樣問(wèn)題的完成解決了.
這樣只需要運(yùn)行一次php.實(shí)時(shí)倒計(jì)時(shí)的時(shí)間就和服務(wù)器的時(shí)間同步了.
理論是同步的,但實(shí)際測(cè)試會(huì)有1秒的誤差.(具體原因就是和網(wǎng)速有關(guān),網(wǎng)速越快,誤差就越小),但這決不會(huì)影響到我們上面的要求了.
實(shí)例:
代碼：
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
<?php
//php的時(shí)間是以秒算。js的時(shí)間以毫秒算
date_default_timezone_set("Asia/Hong_Kong");//地區(qū)
//配置每天的活動(dòng)時(shí)間段
$starttimestr = "09:00:00";
$endtimestr = "18:30:00";
$starttime = strtotime($starttimestr);
$endtime = strtotime($endtimestr);
$nowtime = time();
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>PHP實(shí)時(shí)倒計(jì)時(shí)!</title>
<script language="JavaScript">
<!-- //
var EndTime=<?=$endtime*1000?>;
var NowTime = new Date();
//計(jì)算出服務(wù)器和客戶(hù)端的時(shí)間差。
var dTime = <?=$nowtime*1000?>-NowTime.getTime();
function GetRTime(){
var NowTime = new Date();
var nMS = EndTime - NowTime.getTime()-dTime;
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("還有最后五分鐘！");
}
setTimeout("GetRTime()",1000);
}
window.onload=GetRTime;
// -->
</script>
</head>
<body>
<h1><strong id="RemainH">XX</strong>:<strong id="RemainM">XX</strong>:<strong id="RemainS">XX</strong></h1>
</body>
</html>
實(shí)例2:
修改了上面的一些bug
代碼：
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
<?php
//php的時(shí)間是以秒算。js的時(shí)間以毫秒算
date_default_timezone_set("Asia/Hong_Kong");//地區(qū)
//配置每天的活動(dòng)時(shí)間段
$starttimestr = "09:00:00";
$endtimestr = "18:30:00";
$starttime = strtotime($starttimestr);
$endtime = strtotime($endtimestr);
$nowtime = time();
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>PHP實(shí)時(shí)倒計(jì)時(shí)!</title>
<script language="JavaScript">
<!-- //
var EndTime=<?=$endtime*1000?>;
var NowTime = new Date();
//計(jì)算出服務(wù)器和客戶(hù)端的時(shí)間差。
var dTime = NowTime.getTime()-<?=$nowtime*1000?>;
var runtimes = 0;
function GetRTime(){
var NowTime = new Date();
var dTimeNew = NowTime.getTime()-<?=$nowtime*1000?>;
var dTimesM = Math.abs(Math.floor((dTimeNew-runtimes*1000-dTime)/1000));//客戶(hù)端時(shí)間和服務(wù)器當(dāng)前時(shí)間的差
if (dTimesM>1) {//如果用戶(hù)修改了客戶(hù)端時(shí)間，就重新load本頁(yè)
window.location.reload();
}
var nMS = EndTime - NowTime.getTime()+dTime;
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>
</head>
<body>
<h1><strong id="RemainH">XX</strong>:<strong id="RemainM">XX</strong>:<strong id="RemainS">XX</strong></h1>
</body>
</html>
實(shí)例3:
思路不同,簡(jiǎn)單多了.
代碼：
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
<?php
//php的時(shí)間是以秒算。js的時(shí)間以毫秒算
date_default_timezone_set("Asia/Hong_Kong");//地區(qū)
//配置每天的活動(dòng)時(shí)間段
$starttimestr = "09:00:00";
$endtimestr = "13:50:00";
$starttime = strtotime($starttimestr);
$endtime = strtotime($endtimestr);
$nowtime = time();
if ($nowtime<$starttime){
die("活動(dòng)還沒(méi)開(kāi)始,活動(dòng)時(shí)間是：{$starttimestr}至{$endtimestr}");
}
$lefttime = $endtime-$nowtime; //實(shí)際剩下的時(shí)間（秒）
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>PHP實(shí)時(shí)倒計(jì)時(shí)!</title>
<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>
</head>
<body>
<h1><strong id="RemainH">XX</strong>:<strong id="RemainM">XX</strong>:<strong id="RemainS">XX</strong></h1>
</body>
</html>
【php實(shí)時(shí)倒計(jì)時(shí)功能實(shí)現(xiàn)方法詳解】相關(guān)文章：
php實(shí)時(shí)倒計(jì)時(shí)的三種實(shí)現(xiàn)方法實(shí)例05-25
php+js實(shí)現(xiàn)倒計(jì)時(shí)功能02-08
PHP實(shí)現(xiàn)搜索查詢(xún)功能的方法技巧08-01
PHP中讀取大文件實(shí)現(xiàn)方法詳解04-30
php實(shí)現(xiàn)圖片縮放功能類(lèi)02-04
詳解PHP實(shí)現(xiàn)異步調(diào)用的4種方法07-22