Question

我正在使用倒计时器插件，它在页面刷新后重新启动，我不能在计时器div内的值，因为div每次运行时绑定我想将它存储在cookie中并在页面刷新后检索任何人都可以引用代码来执行此操作

我使用下面的代码来调用计时器插件

$("#hms_timer").countdowntimer({
        hours : hrs,
        minutes : mins,
        seconds : sec,
        size : "lg",
        pauseButton : "pauseBtnhms",
        stopButton : "stopBtnhms"
    });

This link is where i got timer plugin

Answer 1

查看插件文档，无法检索剩余的当前时间。您可以获得当前剩余时间的唯一方法是解析计时器的HTML输出。

由于倒数计时器非常基本，我建议你自己编写倒数计时器，并添加你所说的所需的cookie机制。

Answer 2

每当读取页面时，旧页面的整个上下文都会被销毁，并创建一个全新的上下文。您无法在下一页加载时运行一个页面加载计时器。

如果您需要将某个状态从一个页面加载保存到下一个页面然后在下一页中加载检查该状态并确定如何设置初始页面以匹配之前的状态，那么您可以保存状态在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函数。

如果您发现此答案有帮助，请将其标记为答案/ upvote。

倒计时器插件在页面刷新后重新启动

2 个答案: