我一直在努力,所以我终于想到我应该问。下面我将发布我的内容,任何直接的解决方案都会很棒。我会尽量详细说明。
我需要创建什么?
与MySQL交互的拍卖类型倒计时,以检索相关物品的结束时间。我还将使用Javascript来获得实时倒计时动画。它需要使用服务器时间而不是用户在计算机上的时间,而这似乎不起作用。
使用的文件类型
PHP,Javascript,MySQL
特别提示
我还必须确保时间来自服务器而不是目标计算机。如果有更好的方法来做我想做的事,请告诉我。我已经做了很多研究,仍然无法使其发挥作用。
文件名
index.php - Main File
db.php - Connection to DB - within "system" folder
functions.php - Contains all functions. - within "system" folder
数据库信息
Table Name: time
Fields : id, name, end_time
关于DataBase的注意事项:“end_time”是TimeStamp
的index.php
<?
// Calls the DB for Connection
include("system/db.php");
// Calls all Functions
include("system/functions.php");
?>
<!-- Loads the actual Countdown -->
<div id="countdowncontainer"></div>
<br />
<?
// This Part loads the "end_date" so the countdown can stop.
////////////////////////////////////////////////////////////
$id_num = "1";
$result = mysql_query("SELECT * FROM item WHERE id = '$id_num'");
while($row = mysql_fetch_array($result))
{
$end_time = $row['end_date']; // 2013-12-11 00:00:00
$end_time = $end_time ;
}
?>
<!-- The script below loads the data from the server in this format :
2013-12-11 00:00:00 -->
<script type="text/javascript">
var futuredate=new cdtime("countdowncontainer", "<? echo $end_time; ?>")
futuredate.displaycountdown("days", formatresults)
</script>
以下文件是函数文件。这是我认为我需要更改或做某事以便它可以加载服务器时间而不是当地时间的地方。
的functions.php
<script type="text/javascript">
function cdtime(container, targetdate) {
if (!document.getElementById || !document.getElementById(container)) return
this.container = document.getElementById(container)
this.currentTime = new Date()
this.targetdate = new Date(targetdate)
this.timesup = false
this.updateTime()
}
cdtime.prototype.updateTime = function () {
var thisobj = this
this.currentTime.setSeconds(this.currentTime.getSeconds() + 1)
setTimeout(function () {
thisobj.updateTime()
}, 1000) //update time every second
}
cdtime.prototype.displaycountdown = function (baseunit, functionref) {
this.baseunit = baseunit
this.formatresults = functionref
this.showresults()
}
cdtime.prototype.showresults = function () {
var thisobj = this
var timediff = (this.targetdate - this.currentTime) / 1000 //difference btw target date and current date, in seconds
if (timediff < 0) { //if time is up
this.timesup = true
this.container.innerHTML = this.formatresults()
return
}
var oneMinute = 60 //minute unit in seconds
var oneHour = 60 * 60 //hour unit in seconds
var oneDay = 60 * 60 * 24 //day unit in seconds
var dayfield = Math.floor(timediff / oneDay)
var hourfield = Math.floor((timediff - dayfield * oneDay) / oneHour)
var minutefield = Math.floor((timediff - dayfield * oneDay - hourfield * oneHour) / oneMinute)
var secondfield = Math.floor((timediff - dayfield * oneDay - hourfield * oneHour - minutefield * oneMinute))
if (this.baseunit == "hours") { //if base unit is hours, set "hourfield" to be topmost level
hourfield = dayfield * 24 + hourfield
dayfield = "n/a"
} else if (this.baseunit == "minutes") { //if base unit is minutes, set "minutefield" to be topmost level
minutefield = dayfield * 24 * 60 + hourfield * 60 + minutefield
dayfield = hourfield = "n/a"
} else if (this.baseunit == "seconds") { //if base unit is seconds, set "secondfield" to be topmost level
var secondfield = timediff
dayfield = hourfield = minutefield = "n/a"
}
this.container.innerHTML = this.formatresults(dayfield, hourfield, minutefield, secondfield)
setTimeout(function () {
thisobj.showresults()
}, 1000) //update results every second
}
function formatresults() {
if (this.timesup == false) { //if target date/time not yet met
var displaystring = arguments[0] + " days " + arguments[1] + " hours " + arguments[2] + " minutes " + arguments[3] + " seconds <b>left until Target Date </b>"
} else { //else if target date/time met
var displaystring = "<? $test2 = "
Test Is a Success ";?><b><? echo $test2; ?></b>"
}
return displaystring
}
</script>
现在这个工作正常。但是,如果我改变当地时间,我可以欺骗它而不是服务器时间因为无法改变。
我缺少什么?
答案 0 :(得分:0)
问题在于:
this.currentTime=new Date()
您使用本地客户日期作为“当前”日期。相反,你应该像对待目标日期那样传递它。
E.g。喜欢这个
(php)
$current_time = date( 'Y-m-d H:i:s' );
(javascript)
var futuredate = new cdtime( "countdowncontainer", "<? echo $current_time; ?>", "<? echo $end_time; ?>")
和
function cdtime(container, currentdate, targetdate) {
...
this.currentdate=new Date(currentdate)
完成此操作后,您可以使用超时功能打开时钟。
但是,这会导致时间稍微蠕变(有时候注意它在eBay上的表现如何)。
回合的方式是,不时地向服务器询问时间。并重置'currentTime'。您可以通过使用PHP实现一个简单的服务来实现这一点,该服务返回时间 - 可能是JSON,然后使用AJAX调用它。
答案 1 :(得分:0)
以毫秒(或秒)检索计数器长度是一种更好的方法,然后将其传递给您的javascript函数以创建targetdate
。这样倒计时与用户有关。例如:
- 用户所在的时区距服务器+5小时
- 您的倒计时将在2013年12月4日17:00(对于服务器)完成
- 对于实际用户,倒计时将于2013年12月4日22:00结束。
醇>(如果您不将其保留在用户本地,时间安排将不正确,并且可能很容易让您的用户感到困惑。)
将毫秒添加到日期的示例(这为Javascript日期增加了5个小时):
var targetdate=new Date(currentTime.getTime() + 18000000);
获取时差的示例(使用Javascript):
// PHP
//Get current date
$currdate = date('Y-m-d H:i:s');
$end_time = $row['end_date']; // 2013-12-11 00:00:00
$end_time = $end_time;
// Javascript
//Pass current date to the Javascript function
var futuredate=new cdtime("countdowncontainer", "<? echo $currdate; ?>", "<? echo $end_time; ?>")
function cdtime(container, currentdate, targetdate) {
if (!document.getElementById || !document.getElementById(container)) return
this.container = document.getElementById(container)
this.currentTime = new Date()
//Creates temp date variables
var curDate = new Date(currentdate);
var endDate = new Date(targetdate);
//Gets time Difference in Milliseconds
var diff = endDate.getTime() - curDate.getTime();
//Sets targetdate to be the current date + the difference
this.targetdate = new Date(currentTime.getTime() + diff)
this.timesup = false
this.updateTime()
}