比如要做一个限时购物的功能,这就要做到倒计时,要有实时的倒计时。
要求要有小时分钟秒的实时倒计时的显示,用户端修改日期时间不会影响到倒计时的正常显示(也就是以服务器时间为准)。
其实这和很多的考试等系统的时间限制功能同样的要求。
总不能用ajax每秒都获取服务器时间吧,所以实时倒计时一定要用javascript实现。这很简单,网上一大把的例子。
现在问题是解决用户端修改日期时间对我们的显示的影响。
解决的办法是计算出用户端的时间和服务器的时间差,这样问题的完成解决了。
这样只需要运行一次php,实时倒计时的时间就和服务器的时间同步了。
理论是同步的,但实际测试会有1秒的误差。(具体原因就是和网速有关,网速越快,误差就越小),但这决不会影响到我们上面的要求了。
程序演示
XX:XX:XX
注:秒杀时间从早上点到晚上10点。
Code 如下:
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 | <?php
date_default_timezone_set( 'PRC' );
$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>
|
Salin selepas log masuk
http://www.bkjia.com/PHPjc/752493.htmlwww.bkjia.comtruehttp://www.bkjia.com/PHPjc/752493.htmlTechArticle比如要做一个限时购物的功能,这就要做到倒计时,要有实时的倒计时。 要求要有小时分钟秒的实时倒计时的显示,用户端修改日期时间不...