使用Javascript和PHP的24小时倒数计时器 [英] 24 hour Countdown timer using Javascript and PHP

问题描述

我需要24小时倒数计时器，如链接中的图像。我需要在我的WordPress网站上实现计时器。定时器应该每晚在东部时间午夜复位。

这是我当前的JS代码，但每次刷新页面时都会重新启动。我可以以某种方式将它与EST集成吗？

 < script type =text / javascript> 
 
 var timeInSecs; 
 var ticker; 
 
函数startTimer（秒）{
 timeInSecs = parseInt（秒）; 
 ticker = setInterval（tick（），1000）; 
} 
 
函数tick（）{
 var secs = timeInSecs; 
 if（secs> 0）{
 timeInSecs--; 
} 
 else {
 clearInterval（ticker）; 
 startTimer（172800）; //再次开始
} 
 
 var hours = Math.floor（secs / 3600）; 
 secs％= 3600; 
 var mins = Math.floor（secs / 60）; 
 secs％= 60; 
 var pretty =（（hours <10）？0：）+ hours +：+（（mins <10）？0：）+ mins +： +（（secs <10）？0：）+ secs; 
 document.getElementById（countdown）。innerHTML = pretty; 
} 
 
 startTimer（86400）; // 24小时（秒）
 
< / script> 
 
< span id =countdownstyle =font-weight：bold;>< / span> 
  

解决方案

我会再看一次首页，但问题是，每当你的页面加载时你调用startTimer（）方法，你需要做的是获取当前系统时间（以EST格式），并将其转换为秒
这样，当你的页面刷新时，您将获得当前时间，而不是您当前定义的常量 - 我希望这是您找到解决方案的基础。

I need a 24 hour countdown timer like the image in the link. I need to implement the timer to my wordpress site. The timer should reset every night at midnight EST.

This is my current JS Code but it restarts each time i refresh the page. Can I somehow integrate it with EST?

    <script type = "text/javascript">

var timeInSecs;
var ticker;

function startTimer(secs) {
timeInSecs = parseInt(secs);
ticker = setInterval("tick()", 1000); 
}

function tick( ) {
var secs = timeInSecs;
if (secs > 0) {
timeInSecs--; 
}
else {
clearInterval(ticker);
startTimer(172800);  // start again
}

var hours= Math.floor(secs/3600);
secs %= 3600;
var mins = Math.floor(secs/60);
secs %= 60;
var pretty = ( (hours < 10 ) ? "0" : "" ) + hours + ":" + ( (mins < 10) ? "0" : "" ) + mins + ":" + ( (secs < 10) ? "0" : "" ) + secs;
document.getElementById("countdown").innerHTML = pretty;
}

startTimer(86400);  // 24 hours in seconds

</script>

<span id="countdown" style="font-weight: bold;"></span>

解决方案

I'll take another look at this when I am home, your problem however is that every time your page loads you are calling the startTimer() method, what you need to do is get the current system time (in EST format) and convert that to seconds That way when your page refreshes you will have the current time and not your current defined constant - I hope this is a basis for you to find a solution.

这篇关于使用Javascript和PHP的24小时倒数计时器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！