创建不受页面刷新影响的计时器或警报

Question

我想在我的网站中创建一个计时器/警报，提示用户距离您登录已经过去 1 小时了。 刷新页面时计时器不应从头开始。我尝试使用

setTimeout(function(){
  alert('signout!!');
}, 10000);

只要不刷新页面它就可以正常工作。欢迎任何想法。有没有办法从db计算时间？我将登录时间存储在数据库中。

谢谢

Answer 1

使用 cookie 来存储开始时间。在页面加载时，您可以检查 cookie，并相应地设置计时器。

当计时器到达小时标记时，或者如果页面在到达该标记后加载，则提示用户并删除 cookie。

要在 Javascript 中设置 cookie，请查看此页面：
http://www.w3schools.com/js/js_cookies.asp

Answer 2

将您的计时器与特定的日期/时间联系起来——在页面加载时，找出到未来该点为止剩余的秒数，并相应地设置超时。您可以在客户端或服务器上完成工作。无论哪种方式。

Answer 3

我得到了这样的解决方案。
在 标签中

<?php
                $cur_id = $_SESSION["cur_id"];      
                $st="select crStarttime, ADDTIME(crStarttime, '1:00:00') as en from callrecord where crID  = '$cur_id'";
                $rt = mysql_query($st);
                $r = mysql_fetch_array($rt);
                $starttime = $r['crStarttime'];
                $endtime=$r['en'];
            ?>      
            <script>
                var endtime = "<?php echo $endtime;?>";
            </script>
            <script type="text/javascript">
                function startTime()
                {
                    var today=new Date();
                    var h=today.getHours();
                    var m=today.getMinutes();
                    var s=today.getSeconds();
                    // add a zero in front of numbers<10
                    m=checkTime(m);
                    s=checkTime(s);
                    document.getElementById('txt').innerHTML=h+":"+m+":"+s;
                    var curtime =h+":"+m+":"+s; 
                    t=setTimeout('startTime()',500);
                    if(curtime==endtime)
                    {                   
                        alert("Time to signout.");
                    }                       

                }
                function checkTime(i)
                {
                    if (i<10)
                    {
                        i="0" + i;
                    }
                    return i;
                }
            </script>

然后在正文中

<div id="txt"></div> // just to print the current time.