我有一个$dbSessionDuration变量，通过使用 mysqli，它能够将查询中的数据结果绑定到这个变量中。该$dbSessionDuration变量保存时间，因此该变量的时间格式如下：
01:30:10
现在这意味着 1 小时 30 分 10 秒。我想要做的是$dbSessionDuration在计时器中显示值，以便在上面的示例中，它将从 01:30:10 开始计时，并在停止时一直到 0。我的问题是如何创建计时器并将任何值$dbSessionDuration放入计时器中以倒计时到 00:00:00？
首先，您必须以秒为单位转换时间。
<?php
list($hour,$min,$sec) = explode(':', $dbSessionDuration);
$dbSessionDurationTime = mktime(0,0,0,$hour,$min,$sec);
?>
要创建倒计时，您必须使用 Javascript。
<script type="text/javascript">
var millis = <?php echo $dbSessionDurationTime; ?>
function displaytimer(){
var hours = Math.floor(millis / 36e5),
mins = Math.floor((millis % 36e5) / 6e4),
secs = Math.floor((millis % 6e4) / 1000);
//Here, the DOM that the timer will appear using jQuery
$('.count').html(hours+':'+mins+':'+secs);
}
setInterval(function(){
millis -= 1000;
displaytimer();
}, 1000);
</script>
我没有测试，但这应该可以！
您首先应该知道，您创建的任何JavaScript 计时器都是不准确的。这是由于无数原因在这里总结得很好。
现在的美妙之处在于，您可以通过在每次迭代中简单检查用户的系统时间来限制脚本的不准确性。是用户的系统时间。
在您的情况下，这不是问题，因为您对经过的时间（01:30:10）感兴趣，但是如果您正在等待特定的时间，您将需要处理时区差异或者只是一个糟糕的在用户的计算机上设置时钟。
您还必须了解的是，如果这是一个安全问题，您将无法解释加载脚本后系统时钟的更改。
示例：某些网站会强制您在执行特定操作之前等待。但是提前改变你的时钟，在大多数情况下会帮助你绕过糟糕的安全性。在大多数情况下，它不会因为辅助检查是在服务器端完成的。我想说的是，进行这些服务器端检查。
为了回答您的问题，我会亲自计算通过所需的秒数：
$time = explode(':',$dbSessionDuration);# get hour, minutes, seconds to be elapsed
$time = $time[2] + $time[1] * 60 + $time[0] * 3600;# get elapse time in seconds
在您的 JavaScript 文件中，您可以执行以下操作：
(function(endTime){
endTime*=1000; // javascript works with milliseconds
endTime+=new Date().getTime();// add the current system time into the equation
// your timeSync function
(function timerSync() {
var diff = new Date(endTime - new Date().getTime());
var timer=document.getElementById('timer');
if(diff<=0)return timerEnd(timer);
timer.innerHTML =
doubleDigits(diff.getUTCHours())
+ ':' +
doubleDigits(diff.getUTCMinutes())
+ ':' +
doubleDigits(diff.getUTCSeconds())
;
setTimeout(timerSync,1000);
})();// also call it to start the timer
// your timer end function
function timerEnd(timer) {
timer.innerHTML='Timer has stopped now';
}
// double digit formatting
function doubleDigits(number) {
return number<10
? '0'+number
: number
;
}
})(
<?php echo $time;?>
);// time to elapse 1:30:10
这是一个工作小提琴，但请记住。这没有针对您的特定情况进行优化。您仍然可以将其包装在一个对象中，如果您在页面上有两个计时器，请不要将闭包内存与功能完全相同的功能加倍。
如果您有任何问题，请在评论中提问，我会尽力提供帮助。
代码：http: //jsfiddle.net/g3rRJ/
我将时间分为小时、分钟和秒。时钟每一秒都在递减。我相信算法非常简单：
var timer = setInterval(function(){
seconds--;
if(seconds == -1) {
seconds = 59;
minutes--;
if(minutes == -1) {
minutes = 59;
hours--;
if(hours==-1) {
alert("timer finished");
clearInterval(timer);
return;
}
}
}
span.text(correctNum(hours) + ":" + correctNum(minutes) + ":" + correctNum(seconds));
}, 1000);
使用 jQuery，就像你拥有它一样。
这是一个不错的插件https://github.com/jylauril/jquery-runner
这是一个例子：
<html>
<head>
<script src="http://code.jquery.com/jquery-1.9.0.min.js"></script>
<script src="https://raw.github.com/jylauril/jquery-runner/master/build/jquery.runner-min.js"></script>
</head>
<body>
<span id="runner"></span>
<script type="text/javascript">
$(document).ready(function(){
$('#runner').runner({
autostart: true,
countdown: true,
stopAt: 0,
startAt: 30000 // alternatively you could just write: 30*1000
});
});
</script>
</body>
</html>
如果你需要一个计时器，你可以在 Jquery 中使用这个插件，它工作得很好。您只需在阅读后将时间或 $dbSessionDuration 放入 HTML 的隐藏元素中，然后将其放入 jquery 计数器插件中。如果这个想法听起来很有趣，请告诉我，我会留下一个例子。
你可以用更简单的方法做到这一点。首先，您必须从已经以秒为单位的数据库中检索时间
<?php
require_once 'db_connect.php';
$sql = "SELECT * FROM ac_one_config";
$result = $con->query($sql);
if( $result->num_rows > 0 ){
while($row=mysqli_fetch_assoc($result)) {
$time_on = $row['ac_on_time'];
}
}
header( "refresh:$time_on; url=https://localhost/your_project/file.php");
在 Javascript 中，倒计时开始和倒计时从时间开始，$time_on直到 0:00:00
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Massive Electronics</title>
<style type="text/css">
.myClass {
font-family: verdana;
font-size: 16px;
font-weight: normal;
color: black;
line-height: 30px;
}
</style>
</head>
<body>
<script type="text/javascript">
(function () {
var timeLeft = <?php echo $time_on; ?>,
cinterval;
var timeDec = function (){
timeLeft--;
document.getElementById('countdown').innerHTML = timeLeft;
if(timeLeft === 0){
clearInterval(cinterval);
}
};
cinterval = setInterval(timeDec, 1000);
})();
</script>
Redirecting in <span id="countdown"><?php echo floor($time_on); ?></span> seconds.<br><br>
<span class="myClass">Ac ON Page</span>
</body>
</html>
设置持续时间并将此值存储在会话变量中。
<div id="timer"></div>
<?php
$_SESSION['TIME_DURATION'] = 45;
$_SESSION['start_time'] = date("Y-m-d H:i:s");
$end_time = date("Y-m-d H:i:s", strtotime('+'.$_SESSION['TIME_DURATION'].'minutes',strtotime($_SESSION['start_time'])));
if(!isset($_SESSION['end_time']) && empty($_SESSION['end_time'])){
$_SESSION['end_time'] = $end_time;
}
?>
var myVar = setInterval(myTimer, 1000);
function myTimer() {
var xmlhttp = new XMLHttpRequest();
xmlhttp.open("GET","response.php",false);
xmlhttp.send(null);
if(xmlhttp.responseText == "Time Out"){
myStopFunction();
}
$('#timer').html(xmlhttp.responseText);
}
function myStopFunction() {
clearInterval(myVar);
}
文件：response.php
session_start();
if(isset($_SESSION['TIME_DURATION']) && $_SESSION['TIME_DURATION'] != 0 ){
$time_first = strtotime(date("Y-m-d H:i:s"));
$time_second = strtotime($_SESSION['end_time']);
$differenceinseconds = $time_second - $time_first;
$time_lapse=gmdate("i:s",$differenceinseconds);
if($time_lapse=='00:00') {
echo "Time Out";
unset($_SESSION['start_time']);
unset($_SESSION['end_time']);
unset($_SESSION['TIME_DURATION']);
}else {
echo gmdate("i:s",$differenceinseconds);
}
}else{
echo "Time Out";
}