jquery倒計時，但如果頁面刷新/ F5仍然保持計時器

我正在尋找jquery插件倒計時，但如果頁面刷新仍然conter。我正在申請調查問卷，我想顯示倒數計時器，直到60分鐘。我的應用程序現在如果用戶登錄以開始回答問題，他會逐個回答問題，問題是每頁有一個問題。所以如果下一個問題頁面會刷新。所以現在如果用戶想回答下一個問題，倒數計時器將重置爲默認值。現在我使用的jQuery插件這個http://keith-wood.name/countdown.html jquery倒計時，但如果頁面刷新/ F5仍然保持計時器

隨着代碼：

$(function() { 
     var d = new Date(); 
     d = new Date(d.getFullYear(), d.getMonth(), d.getDate(), d.getHours(), d.getMinutes()+59, 59); 
     $('#defaultCountdown').countdown({until: d, format: 'MS'}); 
    });

所以我的問題，有沒有插件的倒數計時器，如果刷新頁面whitout復位定時器爲默認值。

謝謝。

來源

2013-03-31 Loren Ramly

您可以保存您的計數器在cookie。（或分貝，但餅乾更好）。 –

您可以通過將截止日期保存在cookie中，並從每個請求的cookie中獲取值來實現。你的代碼會稍微複雜一點，但它會完成這項工作。您需要jQuery Cookie plugin，並且您可能需要read up on how to use it。

This is what I come up with。您可以更改withCookie的值來查看保存和不保存請求之間截止時間的差異（單擊「運行」而不是重新加載 - 實際上，它將執行相同的操作）。由於我找不到一個託管您正在使用的倒計時插件的CDN，我只是打印了截止日期 - 但由於您想要確保截止日期保持不變，因此您現在唯一需要做的就是生成截止日期變量d作爲的jsfiddle（秒除外），然後調用

$('#defaultCountdown').countdown({until: d, format: 'MS'});

來源

2013-03-31 12:43:40

你好。好的，我會用cookie進行測試。謝謝。 –

我已經解決了回調函數，並存儲分鐘和秒到mysql，因爲如果我使用cookie，如果用戶使用其他計算機登錄如何。我的問題，是否需要大量內存，並且每隔一秒鐘更新數據庫mysql？謝謝 –

@LorenRamly：如果你正在使用這種方法，只需在截止日期到期時節省時間。在每個頁面加載中，然後從數據庫加載截止日期並設置到期日期的計數器。不需要每秒都更新數據庫 - 您只能在頁面加載中讀取數據庫，並且只有在需要更改截止日期時才寫入數據庫。 –

可以存儲初始日期localStorage並嘗試一次頁面進行刷新，從那裏恢復。該問題的答案後，你可以從localStorage

$(function() { 
    var d = localStorage.getItem('date'); 
    if(!d) { 
    d = (new Date()).getTime() + 3599000; 
    localStorage.setItem('date', d); 
    } else { 
    d = parseInt(d); 
    } 
    $('#defaultCountdown').countdown({until: new Date(d), format: 'MS'}); 
}); 

function goNext() { 
    localStorage.removeItem('date'); 
    // Go to next question 
    ... 
}

工作示例刪除日期：http://jsbin.com/oxovih/2/edit

來源

2013-03-31 12:44:48 Vadim

嗨感謝您的回覆，但它無法正常工作。 –

@LorenRamly我已經更新了示例，現在它可以工作。你可以在JSBin上檢查它。您的截止日期計算算法中也有錯誤，所以我修復了一下:) – Vadim

jquery倒計時，但如果頁面刷新/ F5仍然保持計時器

回答

相關問題