实况倒数时钟
|
基本上，我正在生成一个基于计算机的测试，并且显然我想在考试中为应试者提供剩余的时间，并且当倒数达到零时提交测试。
我将持续时间作为time（）与其他测试详细信息一起存储在我的MySQL数据库中。
我的问题是关于实时倒数计时器的最佳方法。我正在努力研究如何做，以便如果学生单击刷新页面，时钟将不会重置。
任何信息都会有所帮助。
谢谢，
没有找到相关结果
已邀请:
5 个回复
伞腹
的PHP//Time left in seconds $timeLeft = time() - $startTime;垫歌蝎降凤
缮淳彼誊
和。 基本上，超时是在执行操作之前的倒计时：间隔是重复的动作：因此，根据您的情况，您可以每隔一分钟设置一个时间间隔，通过ajax调用来检查剩余时间。 这篇好文章中的更多信息：http://www.elated.com/articles/javascript-timers-with-settimeout-and-setinterval/闲窍
埃庐
/* JQUERY: STOPWATCH & COUNTDOWN This is a basic stopwatch & countdown plugin to run with jquery. Start timer, pause it, stop it or reset it. Same behaviour with the countdown besides you need to input the countdown value in seconds first. At the end of the countdown a callback function is invoked. Any questions, suggestions? marc.fuehnen(at)gmail.com */ $(document).ready(function() { (function($){ $.extend({ APP : { formatTimer : function(a) { if (a < 10) { a = \'0\' + a; } return a; }, startTimer : function(dir) { var a; // save type $.APP.dir = dir; // get current date $.APP.d1 = new Date(); switch($.APP.state) { case \'pause\' : // resume timer // get current timestamp (for calculations) and // substract time difference between pause and now $.APP.t1 = $.APP.d1.getTime() - $.APP.td; break; default : // get current timestamp (for calculations) $.APP.t1 = $.APP.d1.getTime(); // if countdown add ms based on seconds in textfield if ($.APP.dir === \'cd\') { $.APP.t1 += parseInt($(\'#cd_seconds\').val())*1000; } break; } // reset state $.APP.state = \'alive\'; $(\'#\' + $.APP.dir + \'_status\').html(\'Running\'); // start loop $.APP.loopTimer(); }, pauseTimer : function() { // save timestamp of pause $.APP.dp = new Date(); $.APP.tp = $.APP.dp.getTime(); // save elapsed time (until pause) $.APP.td = $.APP.tp - $.APP.t1; // change button value $(\'#\' + $.APP.dir + \'_start\').val(\'Resume\'); // set state $.APP.state = \'pause\'; $(\'#\' + $.APP.dir + \'_status\').html(\'Paused\'); }, stopTimer : function() { // change button value $(\'#\' + $.APP.dir + \'_start\').val(\'Restart\'); // set state $.APP.state = \'stop\'; $(\'#\' + $.APP.dir + \'_status\').html(\'Stopped\'); }, resetTimer : function() { // reset display $(\'#\' + $.APP.dir + \'_ms,#\' + $.APP.dir + \'_s,#\' + $.APP.dir + \'_m,#\' + $.APP.dir + \'_h\').html(\'00\'); // change button value $(\'#\' + $.APP.dir + \'_start\').val(\'Start\'); // set state $.APP.state = \'reset\'; $(\'#\' + $.APP.dir + \'_status\').html(\'Reset & Idle again\'); }, endTimer : function(callback) { // change button value $(\'#\' + $.APP.dir + \'_start\').val(\'Restart\'); // set state $.APP.state = \'end\'; // invoke callback if (typeof callback === \'function\') { callback(); } }, loopTimer : function() { var td; var d2,t2; var ms = 0; var s = 0; var m = 0; var h = 0; if ($.APP.state === \'alive\') { // get current date and convert it into // timestamp for calculations d2 = new Date(); t2 = d2.getTime(); // calculate time difference between // initial and current timestamp if ($.APP.dir === \'sw\') { td = t2 - $.APP.t1; // reversed if countdown } else { td = $.APP.t1 - t2; if (td <= 0) { // if time difference is 0 end countdown $.APP.endTimer(function(){ $.APP.resetTimer(); $(\'#\' + $.APP.dir + \'_status\').html(\'Ended & Reset\'); }); } } // calculate milliseconds ms = td%1000; if (ms < 1) { ms = 0; } else { // calculate seconds s = (td-ms)/1000; if (s < 1) { s = 0; } else { // calculate minutes var m = (s-(s%60))/60; if (m < 1) { m = 0; } else { // calculate hours var h = (m-(m%60))/60; if (h < 1) { h = 0; } } } } // substract elapsed minutes & hours ms = Math.round(ms/100); s = s-(m*60); m = m-(h*60); // update display $(\'#\' + $.APP.dir + \'_ms\').html($.APP.formatTimer(ms)); $(\'#\' + $.APP.dir + \'_s\').html($.APP.formatTimer(s)); $(\'#\' + $.APP.dir + \'_m\').html($.APP.formatTimer(m)); $(\'#\' + $.APP.dir + \'_h\').html($.APP.formatTimer(h)); // loop $.APP.t = setTimeout($.APP.loopTimer,1); } else { // kill loop clearTimeout($.APP.t); return true; } } } }); $(\'#sw_start\').live(\'click\', function() { $.APP.startTimer(\'sw\'); }); $(\'#cd_start\').live(\'click\', function() { $.APP.startTimer(\'cd\'); }); $(\'#sw_stop,#cd_stop\').live(\'click\', function() { $.APP.stopTimer(); }); $(\'#sw_reset,#cd_reset\').live(\'click\', function() { $.APP.resetTimer(); }); $(\'#sw_pause,#cd_pause\').live(\'click\', function() { $.APP.pauseTimer(); }); })(jQuery);