【发布时间】:2015-10-22 07:51:56
【问题描述】:
我目前遇到一个问题,不知道如何解决。我是 php 和 javascript 编码的新手,如果有更简单的方法,请纠正我。
我正在制作一个足球运动员拍卖网站。它就像 ebay,除了它是播放器而不是物品。基本上你把球员卖掉,会有一个倒计时。
我的问题是我试图让一个倒数计时器为多个玩家工作。我已经制作了一个成功的倒计时功能,该功能仅适用于一个玩家,但是当我尝试对多个玩家执行此操作时,它并没有按预期工作。它只更新最后一个玩家。
这是一个玩家的输出。
Player Name: Rooney
Hours:20 Minutes:16 Seconds:56
这是两个或更多玩家的输出
Player Name: Messi
Player Name: Beckham
Player Name: Rooney
Hours:20 Minutes:16 Seconds:56
我会解释我到目前为止所得到的。
包含玩家姓名和结束时间的数据库。一个用于连接数据库的 php 文件。最后是一个文件,其中包含我的倒数计时器脚本和我正在测试的地方。
数据库结构
|Player Name|------------|End date/time|---------
Messi July 31 2015 05:00:00 PM
Ronaldo July 31 2015 10:00:00 PM
请注意,结束日期时间是一个字符串,格式如上所示,因此我可以使用 strtotime 函数检索剩余时间。
这就是我正常身体的运作方式。我使用 PHP 和 MySQL 选择了上面的表格。然后我循环打印出每个玩家的名字。在打印每个球员的名字时,我调用计时器函数来获取倒计时时间。这个函数有两个参数。首先是结束日期时间。第二个参数是唯一的 id(div 标签)。我从数据库中获取结束日期/时间,并使用数组创建一个唯一的 id 标记。
我的意图是创建一个函数,该函数获取播放器的结束日期和唯一 id,然后像这样编辑它
document.getElementById(uniqueID).innerHTML =...
因为这是编辑 div 内内容的唯一方法,我知道并且我正在循环中创建多个 div。
这是带有一些 cmets 的主脚本
//Connecting to database
<?php
include 'connect.php';
?>
<!doctype html>
<html>
<head>
<?php
//array used to create unique id for our divs
$ids = array("one","two","three","four","five","six","seven","eight","nine");
$i =0;
function timer($date, $id){
//changing time to london(uk) time.
date_default_timezone_set("Europe/London");
//converting the string from database into time form
$endtime = strtotime($date);
//Returns the current time
$idtemp = $id;
?>
<script>
//convert server time to milliseconds
var server_current = <?php echo time(); ?> * 1000;
var server_end_time = <?php echo $endtime; ?> * 1000;
var client_current_time = new Date().getTime();
//server end time - server current time + client current time
var finish_time = server_end_time - server_current + client_current_time;
var timer;
var uniqueID = <?php echo json_encode($idtemp); ?> ;
function countdown()
{
var now = new Date();
var left = finish_time - now;
//Following code convert the remaining milliseconds into hours, minutes and days.
//milliseconds conversion
//1000-second 60,000-minute
//3,600,000-hour 86,400,400-hour
var hour = Math.floor( (left % 86000000 ) / 3600000 );
var minute = Math.floor( (left % 3600000) / 60000 );
var second = Math.floor( (left % 60000) / 1000 );
document.getElementById(uniqueID).innerHTML = "Hours:"+hour+" Minutes:"+minute+" Seconds:"+second;
}
timer = setInterval(countdown, 1000);
</script>
<?php }?>
</head>
<body>
<h3>Auction House </h3>
<?php
//select table from database
$result = mysql_query("SELECT * FROM `current auction`");
while($row = mysql_fetch_array($result)){
echo 'Player Name: '. $row['PlayerName'];
$timeleft = $row['Time'];
echo '<div id="c">';
$temp = $ids[$i];
?>
<script>
//Change the div id to the next element in array
document.getElementById("c").setAttribute("id",<?php echo json_encode($temp); ?>);
</script>
<?php
$i = $i +1;
echo $temp;
timer($timeleft, $temp);
echo '</div>';
echo "<br />";
}
?>
</body>
</html>
我不确定为什么它不起作用。
谢谢
【问题讨论】:
-
您也许可以解决这个特定问题,但老实说,要正确地做到这一点,您很可能需要利用 nodeJS 之类的东西,这就是 eBay 所做的。只有这样才能将其扩展并在屏幕上实际显示准确的数据。
-
感谢您的提示。会检查的。
标签: javascript php mysql countdown