Как показать таймер с помощью php?
код:
<html>
<head>
<title>Timer</title>
</head>
<body>
<?php
$dbSessionDuration = "1:30:00";
list($hour,$min,$sec) = explode(':', $dbSessionDuration);
$dbSessionDurationTime = mktime(0,0,0,$hour,$min,$sec);
?>
<div class = "count"></div>
<script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<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);
$('.count').html(hours+':'+mins+':'+secs);
}
setInterval(function(){
millis -= 1000;
displaytimer();
}, 1000);
</script>
</body>
</html>
В этом коде я хочу создать таймер, и время начнется после 1:30:00, а затем оно будет уменьшаться на секунду, как 1:29:59, затем 1:29:58, как это, но теперь, когда я использую, чтобы получить время внутри class = "count", этого не происходит. Я не знаю почему? Итак, как я могу исправить эту проблему? пожалуйста, помогите мне.
Спасибо
Я запускаю ваш код, нет проблем. Убедитесь, что mktime(0,0,0,$hour,$min,$sec); дает правильную миллисекунду. В противном случае ваш код js работает
Ответы 2
В вашем коде есть два примечания: -
-Если вы хотите преобразовать переменную из php в javascript, вы должны повторить ее внутри двойной / одинарной кавычки.
- вам нужно получить общее время в millis, поскольку вы используете этот millis для повторной регенерации вашего времени, поэтому это уравнение для преобразования вашего времени в миллис ( ( intval($hour) * 60 * 60 ) + ( intval($min) * 60 ) + ( intval($sec) ) ) * 1000.
Код
<html>
<head>
<title>Timer</title>
</head>
<body>
<?php
$dbSessionDuration = "1:30:00";
list($hour,$min,$sec) = explode(':', $dbSessionDuration);
$dbSessionDurationTime = ( ( intval($hour) * 60 * 60 ) + ( intval($min) * 60 ) + ( intval($sec) ) ) * 1000;
?>
<div class = "count"></div>
<script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
</script>
<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);
$('.count').html(hours+':'+mins+':'+secs);
}
setInterval(function(){
millis -= 1000;
displaytimer();
}, 1000);
</script>
</body>
</html>
Проблема в вашем преобразовании, он возвращает 949219200, где на самом деле он должен был вернуть 5400000
<html>
<head>
<title>Timer</title>
</head>
<body>
<?php
$dbSessionDuration = "1:30:00";
$time = explode(":", $dbSessionDuration);
$hour = $time[0] * 60 * 60 * 1000;
$minute = $time[1] * 60 * 1000;
$sec = $time[2] * 1000;
$dbSessionDurationTime = $hour + $minute + $sec;
?>
<div class = "count"></div>
<script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<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);
$('.count').html(hours+':'+mins+':'+secs);
}
setInterval(function(){
millis -= 1000;
displaytimer();
}, 1000);
</script>
</body>
Теперь $dbSessionDurationTime будет содержать нужное количество миллисекунд 5400000. Вот рабочий код: https://codepen.io/anon/pen/EpGYKo, конечно, части php там нет, но вы можете видеть, что таймер работает так, как вы хотите.
Посмотрите на отладчик вашего браузера (F12) на наличие ошибки js.