我是新來的HTML和JavaScript。我找不到任何解決方案來防止頁面上的計時器在頁面關閉或刷新時自動重啓。即使頁面/瀏覽器關閉或刷新,多個定時器繼續(在後臺運行)
我希望計時器能夠繼續運行,即使我關閉了頁面/瀏覽器。例如:如果定時器倒計時1小時,我激活並關閉它。 30分鐘後,我重新打開頁面,剩餘時間應該是30分鐘。
這裏我的計時器代碼:
function countdown(element, hours, minutes, seconds, oritime) {
var interval;
var htemp = 0;
var mtemp = 0;
interval = setInterval(function() {
var el = document.getElementById(element);
if (seconds == 0) {
if (minutes == 0) {
if (hours == 0) {
clearInterval(interval);
el.innerHTML = oritime;
return;
} else {
if (htemp == 0) {
minutes = 0;
seconds = 0;
htemp = 1;
}
}
} else {
if (mtemp == 0) {
seconds = 0;
mtemp = 1;
}
}
}
if (hours > 0) {
var hour_text = hours > 9 ? '' : '0';
} else {
var hour_text = '0';
}
if (minutes > 0) {
var minute_text = minutes > 9 ? '' : '0';
} else {
var minute_text = '0';
}
var second_text = seconds > 9 ? '' : '0';
el.innerHTML = hour_text + hours + ' : ' + minute_text + minutes + ' : ' + second_text + seconds;
if (seconds == 0) {
if (minutes == 0) {
if (hours == 0) {
clearInterval(interval);
el.innerHTML = oritime;
return;
} else {
if (htemp == 1) {
hours--;
minutes = 59;
seconds = 60;
htemp = 0;
}
}
} else {
if (mtemp == 1) {
minutes--;
seconds = 60;
mtemp = 0;
}
}
}
seconds--;
}, 1000);
}
<input type="button" onclick="countdown('timer1',0,5,0,'5');" value="Start Timer 1">
<div id='timer1' color='red'>5</div>
<input type="button" onclick="countdown('timer2',0,5,0,'5');" value="Start Timer 2">
<div id='timer2' color='red'>5</div>
使用cookie將有可能解決這個問題?如果是這樣,怎麼樣?
我沒有使用PHP或AJAX或jQuery,因爲我還沒有知道。我沒有服務器來發布HTML文件,所以我剛剛找到了一個使用谷歌驅動器發佈的解決方案。
小題目,如果有人有上傳HTML的任何「免費」服務器以便其他人可以通過在線訪問,那就太好了。
免費在沙箱中?你可以使用jsfiddle或codepen。 –
「用於防止頁面上的計時器」 - 您是什麼意思? – alan0xd7
我可以看到你嘗試了clearInterval,但是如果它不適合你,那是因爲變量有不同的作用域,即使它們都被稱爲「interval」。使用document.interval代替間隔並刪除它前面的「var」。document.interval不是「一件事」,但可以將任何變量附加到DOM對象。試試如果這能解決問題。 – Schien