我的计时器功能在Firefox中不起作用

时间:2019-07-12 05:49:10

标签: jquery html

我正在我的项目QuizWeb中制作秒表,它在谷歌浏览器中运行正常。最初,它在firefox中工作,但是一旦我结束测验并重播它,它就无法工作,我也不明白为什么。我正在尝试搜索原因,但对此一无所知。

我已将代码放在下面

$(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(); 
                  //alert($.APP.state);                           
                  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 + '_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;
                  }  
              }
          }    
      });
      $(window).on("load", function () {
        $.APP.startTimer('sw');
    });
        
      /*$('#sw_start').on('click', function() {
            $.APP.startTimer('sw');
      });*/    

      $('#sw_stop').on('click', function() {
          $.APP.stopTimer();
          var hour = $('#sw_h').html();
          var minute = $('#sw_m').html();
          var second = $('#sw_s').html();
          $("#result").html("You Have Pause Watch At Hour:"+hour+" Minute:"+minute+" Second:"+second);
      });
      
      $('#sw_pause').on('click', function() {
        $.APP.pauseTimer();
        var hour = $('#sw_h').html();
        var minute = $('#sw_m').html();
        var second = $('#sw_s').html();
        $("#result").html("You Have Pause Watch At Hour:"+hour+" Minute:"+minute+" Second:"+second);
     });                
              
  })(jQuery);
      
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<span  class="exam-timer">
    <span  id="timer">
        <span>
            <span id="sw_h">00</span>:
            <span id="sw_m">00</span>:
            <span id="sw_s">00</span>
        </span>
    </span>
</span>

正如我所说的,这段代码在chrome中可以正常工作,但在Firefox中却无法正常工作 有人可以帮我吗?

0 个答案:

没有答案