我正在做一个在线考试页面。在此页面中，我有一个倒数计时器，它按数据库中的值倒计时。它工作正常，但是当我刷新页面时它会重置。我必须停止计时器重置。
这是我的JavaScript计时器代码：
<script type="text/javascript">
function CountDown(duration, display) {
if (!isNaN(duration)) {
var timer = duration, minutes, seconds;
var interVal = setInterval(function () {
minutes = parseInt(timer / 60, 10);
seconds = parseInt(timer % 60, 10);
minutes = minutes < 10 ? "0" + minutes : minutes;
seconds = seconds < 10 ? "0" + seconds : seconds;
$(display).html("<b>" +"Time Remaining: "+ minutes + "m : " + seconds + "s" + "</b>");
if (--timer < 0) {
timer = duration;
SubmitFunction();
$('#display').empty();
clearInterval(interVal)
}
},1000);
}
}
function SubmitFunction(){
$('#result').click();
}
CountDown(<?php echo $t*30; ?>,$('#display')); //$t comes from database
function disable_f5(e) {
if ((e.which || e.keyCode) == 116) {
e.preventDefault();
}
}
$(document).ready(function(){
$(document).bind("keydown", disable_f5);
});
</script>
我刚刚看到了你的问题，打算试一试。我建议的一件事是尝试将值提交到本地存储。您可以添加一个事件侦听器，让它指定侦听重新加载，并在重新加载时将整数值以 JSON 格式提交到本地存储。只是一个想法。
如果您已经在使用数据库，那么向现有表添加一个表或一个额外的字段来记录用户开始检查的日期时间，然后在每个页面加载时 - 您可以从数据库中获取开始时间，进行一些时髦的计算，然后显示剩余时间。
这样，您就不会依赖于浏览器跟踪中的计算（尽管我可能会按照已经建议的那样尝试会话存储），而是可以自信地计算的恒定开始时间。
尝试将其作为一种方法 - 请注意仅列出用于演示方法的代码框架。不过，我会亲自在数据库中设置日期时间。
//at commencement of exam
//js var commencementTime = (//calculation to get current time);
localStorage.setItem('commencementTime ',commencementTime );
//on page reload
var commencementTime= localStorage.getItem('commencementTime ');
if(commencementTime){
//code for calculating countdown}