Javascript和PHP倒计时器为每个人显示相同的计时器

Question

我有生成倒计时器所需的脚本,该计时器有一个启动和恢复按钮.我试图做的是在一个控制另一页上的计时器的页面上有启动,停止和重置按钮.因此,如果用户X访问page.html,他们将看到一个0的计时器.管理员X访问admin.html,他们看到计时器为0,但他们也有一个启动,停止和重置按钮.当管理员点击按钮时,page.html上的计时器开始倒计时.如果另一个用户在计时器倒计时时访问该页面,他们将看到计时器当前所在的位置.如果有人有任何代码想法,我可以参考这个网站上的其他答案,或者我需要的代码,我将非常感激.

---真实的场景我们有skype的人正在做一个节目,他们需要知道什么时候休息一下.这个想法是制作人可以按下一个按钮,开始倒数计时器让他们知道他们有60秒直到休息.我在网页上想要这个的原因是因为页面上还有其他东西正在skype上的人正在关注.所以我想要一些他们不能错过的东西.我可以访问一个SQL服务器,并可以同时执行php和javascript.我猜我需要做两者的某种组合.

更新感谢大家的帮助.

我正在更新这个,因为我意识到我可能会让事情变得比他们现在需要的更复杂.每30分钟休息一次,所有节目将从一小时开始或在30分钟后开始.我终于找到了完美的剧本.虽然由于正常的时钟漂移可能略微偏离,但无论谁进入页面,它实际上都应该显示相同.

<script>
 function addZero(i)
{
if (i<10)
  {
   i="0" + i;
  }
 return i;
 }
 setInterval(function() {
   function addZero(i)
{
if (i<10)
  {
  i="0" + i;
  }
return i;
}
    var d = new Date();
    var s =(d.getSeconds());
    var m =(d.getMinutes());
    var x = document.getElementById("timer");
    var c = addZero(30 - m) + ":" + addZero(60 - s);
    var d = addZero(60 - m) + ":" + addZero(60 - s);
    if (m < 30) {
        t = c
    }
    else {
        t = d
    }

     x.innerHTML = t;
 }, 250) 
    </script>    
 <div align="center">
    <table><tbody>
    <tr><td style="font-size:34px;" id="timer"></td>
    <td nowrap="nowrap" width="15px"><p style="text-align: left;"></p></td>
    <td style="font-size:24px;">Minutes till Station Break.</td></tr>
     </tbody></table>
          </div>

Answer 1

我终于想出了一个可行的解决方案。还有一些元素我还没有完全弄清楚如何修复，但下面的代码基本上完全满足了我现在的需要。

setInterval(function() {
function addZero(i) {
    if (i < 10) {
        i = "0" + i;
    }
    return i;
}
var x = document.getElementById("timer");
var d = new Date();
var s = (d.getSeconds());
var m = (d.getMinutes());
var a = addZero(30 - m);
var b = addZero(60 - m);
var c = (60 - s);
var z = "<span style='color:red;font-size:50px;'>" + "Break" + "</span>";
var v = "<span style='color:black;font-size:24px;'>" + "Break" + "</span>";

if (m > 30) {
    y = b;
}
else if (m < 30) {
    y = a;
}
if (y < 2 && c < 15) {
    q = z;
}
else {
    q = v;
}

var t = y + (":" + addZero(c) + " Till Station " + (q));
x.innerHTML = t;
}, 250);



<div align="center" id="timer" style='color:black;font-size:24px;' ></div>