Jtti广告广告
返回顶部
首页 > 资讯 > 后端开发 > PHP编程 >php如何实现倒计时
  • 652
分享到

php如何实现倒计时

php倒计时 2015-09-03 17:09:26 652人浏览 才女
摘要

本文操作环境:windows7系统、PHP7.1版、DELL G3电脑php如何实现倒计时?php实时倒计时功能实现方法详解具体如下:这几天公司要做一个限时购物的功能.这就要做到倒计时,要有实时的倒计时.要求:1) 要有小时分钟秒的实时倒计

本文操作环境:windows7系统、PHP7.1版、DELL G3电脑

php如何实现倒计时?

php实时倒计时功能实现方法详解

具体如下:

这几天公司要做一个限时购物的功能.这就要做到倒计时,要有实时的倒计时.

要求:

1) 要有小时分钟秒的实时倒计时的显示

2)用户端修改日期时间不会影响到倒计时的正常显示(也就是以服务器时间为准)

其实这和很多的考试等系统的时间限制功能同样的要求.

解决思路:

1)总不能用ajax每秒都获取服务器时间吧.

所以实时倒计时一定要用javascript实现.这很简单.网上一大把的例子.

2)现在问题是解决用户端修改日期时间对我们的显示的影响.

解决的办法是计算出用户端的时间和服务器的时间差.这样问题的完成解决了.

这样只需要运行一次php.实时倒计时的时间就和服务器的时间同步了.

理论是同步的,但实际测试会有1秒的误差.(具体原因就是和网速有关,网速越快,误差就越小),但这决不会影响到我们上面的要求了.

实例:

代码:

<?php
//php的时间是以秒算。js的时间以毫秒算
date_default_timezone_set("Asia/Hong_Kong");//地区
//配置每天的活动时间段
$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实时倒计时!</title>
<script language="JavaScript">
<!-- //
var EndTime=<?=$endtime*1000?>;
var NowTime = new Date();
//计算出服务器和客户端的时间差。
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>

实例2:

修改了上面的一些bug

代码:

<?php
//php的时间是以秒算。js的时间以毫秒算
date_default_timezone_set("Asia/Hong_Kong");//地区
//配置每天的活动时间段
$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实时倒计时!</title>
<script language="JavaScript">
<!-- //
var EndTime=<?=$endtime*1000?>;
var NowTime = new Date();
//计算出服务器和客户端的时间差。
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));//客户端时间和服务器当前时间的差
if (dTimesM>1) {//如果用户修改了客户端时间,就重新load本页
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>

实例3:

思路不同,简单多了.

代码:

<?php
//php的时间是以秒算。js的时间以毫秒算
date_default_timezone_set("Asia/Hong_Kong");//地区
//配置每天的活动时间段
$starttimestr = "09:00:00";
$endtimestr = "13:50:00";
$starttime = strtotime($starttimestr);
$endtime = strtotime($endtimestr);
$nowtime = time();
if ($nowtime<$starttime){
die("活动还没开始,活动时间是:{$starttimestr}至{$endtimestr}");
}
$lefttime = $endtime-$nowtime; //实际剩下的时间(秒)
?>
<!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实时倒计时!</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>

--结束END--

本文标题: php如何实现倒计时

本文链接: https://www.lsjlt.com/news/485.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

猜你喜欢
  • js如何实现倒计时
    这篇文章将为大家详细讲解有关js如何实现倒计时,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。首先呢,开始写之前一定要理清楚思路,思路清晰了,那写起来就容易多了,下面我分了...
    506
    2023-05-30
    js
  • jQuery如何实现倒计时
    这篇文章将为大家详细讲解有关jQuery如何实现倒计时,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。具体代码如下所示:<!DOCTYPE html>...
    669
    2023-05-30
    jquery
  • jquery如何实现倒计时小应用
    这篇文章主要为大家展示了“jquery如何实现倒计时小应用”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“jquery如何实现倒计时小应用”这篇文章吧。具体内容如...
    367
    2023-05-30
    jquery
  • jquery如何实现10秒倒计时
    本篇内容介绍了“jquery如何实现10秒倒计时”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成! ...
    483
    2023-05-30
    jquery
  • vue、react如何实现倒计时效果
    这篇文章主要介绍vue、react如何实现倒计时效果,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!Vue方案一:俩个元素HTML:<div id="exam...
    226
    2023-05-30
    vue react
  • JavaScript如何实现验证码倒计时
    小编给大家分享一下JavaScript如何实现验证码倒计时,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧! ...
    650
    2023-05-30
    javascript
  • JavaScript如何实现输入分钟、秒倒计时
    这篇文章主要介绍JavaScript如何实现输入分钟、秒倒计时,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!代码如下:<div class="contain...
    839
    2023-05-30
    js
  • Android 中不用线程如何实现倒计时
    需求: 有多个组件可以开启倒计时,正常情况下默认倒计时时间终了后更新UI,另,用户可以取消指定倒计时。 这里使用CountDownTimer进行倒计时,其中回调函数onFini...
    356
    2023-05-30
    倒计时 线程 Android
  • js如何实现短信发送倒计时功能
    这篇文章将为大家详细讲解有关js如何实现短信发送倒计时功能,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。本文实例为大家分享了js短信发送倒计时的具体代码,供大家参考,具体...
    567
    2023-05-30
    js
  • js如何实现防刷新的倒计时
    这篇文章主要为大家展示了“js如何实现防刷新的倒计时”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“js如何实现防刷新的倒计时”这篇文章吧。最近在维护考试系统,在...
    801
    2023-05-30
    js
  • 倒计时:3
    ...
    615
    2023-05-30
    倒计时
  • python倒计时
    #coding=gb import os import time for x in sorted(range(11),reverse=True): print '比赛结束倒计时: %s ' % x time.sleep(1...
    551
    2023-05-30
    倒计时 python
  • js如何倒计时功能
    这篇文章主要介绍“js如何倒计时功能”,在日常操作中,相信很多人在js如何倒计时功能问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”js如何倒计时功能”的疑惑有所帮助!接下来,...
    541
    2023-05-30
    js
  • Android实现圆圈倒计时
    本文实例为大家分享了Android实现圆圈倒计时的具体代码,供大家参考,具体内容如下 1. 显示效果如下 2. 首先是创建shape的xml文件 在res/drawable目录下创...
    545
    2023-05-30
    Android 倒计时
  • vue实现列表倒计时
    本文实例为大家分享了vue实现列表倒计时的具体代码,供大家参考,具体内容如下 如图10分钟倒计时 在做项目的时候遇到vue列表要用到倒计时的方法,想直接在页面中处理,使用vue过滤...
    796
    2023-05-30
    vue 列表 倒计时
  • Flutter实现倒计时功能
    本文实例为大家分享了Flutter实现倒计时功能的具体代码,供大家参考,具体内容如下 有一个需求,需要在页面进行显示倒计时,倒计时结束后,做相应的逻辑处理。 实现思路:在Flutte...
    826
    2023-05-30
    Flutter 倒计时
  • Handler实现倒计时功能
    本文实例为大家分享了Handler实现倒计时功能的具体代码,供大家参考,具体内容如下 1、需求 1.1 实现目标 当后台传递一个时间戳时,与当前系统时间做时间差,并转换为时分秒,作为...
    782
    2023-05-30
    Handler 倒计时
  • vue实现倒计时功能
    本文实例为大家分享了vue实现倒计时功能的具体代码,供大家参考,具体内容如下 通过父组件传入的结束时间减去当前日期得到剩余时间 1.子组件部分 <div class="it...
    302
    2023-05-30
    vue 倒计时
  • jQuery如何实现页面倒计时并刷新效果
    这篇文章主要介绍jQuery如何实现页面倒计时并刷新效果,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!代码如下所示:var intDiff = pars...
    898
    2023-05-30
    jquery
  • js定时器如何实现倒计时效果
    这篇文章主要介绍了js定时器如何实现倒计时效果,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。具体内容如下日期函数倒计时 =  用 ...
    621
    2023-05-30
    js
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作