这是我的Java脚本代码,它在刷新时会重置,如何避免这种情况

 <script>
 //define your time in second
    var c=120;
    var t;
    timedCount();

    function timedCount()
    {

        var hours = parseInt( c / 3600 ) % 24;
        var minutes = parseInt( c / 60 ) % 60;
        var seconds = c % 60;

        var result = (hours < 10 ? "0" + hours : hours) + ":" + (minutes <    10 ? "0" + minutes : minutes) + ":" + (seconds  < 10 ? "0" + seconds : seconds);



       document.getElementById("timer").innerHTML=result;


       if(c == 0 )
        {
            //setConfirmUnload(false);
            //$("#quiz_form").submit();
            window.location="result.php?td=$tid";
        }
        c = c - 1;
        t = setTimeout(function()
        {
         timedCount()
        },
        1000);
    }
</script>

最佳答案

每当重新加载页面时,旧页面的整个上下文都会被破坏,并且会创建一个全新的上下文。您无法让计时器在下一页加载时从一页加载开始运行。

如果您需要保存从一次页面加载到下一次页面的某种状态,然后在下一次页面加载中检查该状态,并确切地确定如何设置初始页面以匹配先前发生的情况,则可以在两次页面加载之间保存状态在HTML5本地存储或cookie中。

另一种可能性是不重新加载页面,而是使用ajax和javascript动态更新页面的内容。这样,您的现有计时器将继续运行,因为根本不会重新加载页面。

如果您要使用计时器做的只是显示某个倒计时还剩多少时间,则可以将倒数零时间设置为HTML5本地存储,当重新加载的页面加载时,它可以检查在本地存储中设置的时间,启动倒数计时器,使其与之前的时间相符。


  使用cookie,如果使用HTML5,则使用本地/会话存储来保存状态。


的HTML

<a href="#" onclick="SaveTime()">Save Current Time</a> |
<a href="#" onclick="retrieveTime()">Retrieve Saved Time</a>

<div id="result"></div>


JAVASCRIPT

function SaveTime(){
var date = new Date();
var timeObj = { sec:date.getSeconds(), min:date.getMinutes(), hr:date.getHours() };
localStorage.setItem("timeObj", JSON.stringify(timeObj));
$('#result').append(JSON.stringify(timeObj)+' -- > Saved<br />' );
}

function retrieveTime(){
var timeObj = JSON.parse(localStorage.getItem("timeObj"));
//You have the time with you now
//You have the time with you now
$('#result').append(timeObj.hr+':'+timeObj.min+':'+timeObj.sec+' --> Retrieved<br />');
}


这只是一个基本的示例,可以在单击时将计时器保存在本地存储中。对其进行修改,并定期在计时器中调用javascript函数。

07-24 09:49
查看更多