Javascript setTimeout裏面setInterval

我在這裏有一個問題.. 我使用setInterval函數加載一個頁面到div，每30秒一次。那麼..在該頁面中，我有另一個setInterval函數，它包含一個每秒更改數字的倒數計時器。問題在於，一次倒計時跳過3秒鐘，即使它必須在一秒內回調。這就像：01:24 - > 01:21 - > 01-> 19 ...Javascript setTimeout裏面setInterval

這裏是我的第一個的setInterval代碼：

<script> 
    var t; 
    t=setInterval(function(){ 
     $.get('<?=return_url("php/home_new.php");?>', { k: "1" }).done(function(data){ 
      if(data)$("#ex_start_test").html(data);}); 
     }, 
     30000 
    ); 
</script>

和倒計時代碼：

<? 
$query=q_return("SELECT nume, cod, data, MINUTE(data_start) as minute, data_start FROM chestionare WHERE data_start>date_sub(now(), interval 2 minute)");?> 

<script> 
    var timp_c="<?=$query['minute'];?>"; 
    var sec; 
    var min; 
    $.get('<?=return_url("php/getimp.php");?>', { k: "sec" }).done(function(data){sec=data;}); 
    $.get('<?=return_url("php/getimp.php");?>', { k: "min" }).done(function(data){min=data;}); 

    setTimeout(refresh, 1000); 

    function refresh(){ 
     if(sec>=1){ 
      sec=sec-1; 
     }else{ 
      min=min-1; 
      sec=59; 
     } 

     if(sec<10){ 
      $("span#ex_start_timp_ramas_sec").each(function(){ 
       $(this).html("0"+sec); 
      }); 
     }else{ 
      $("span#ex_start_timp_ramas_sec").each(function(){ 
       $(this).html(sec); 
      }); 
     } 
       $("span#ex_start_timp_ramas_min").each(function(){ 
      $(this).html(min); 
     }); 

     if(sec==0 && min==0){ 
      //$("#ex_click_final").trigger('click'); 
      clearInterval(t); 
      $("#ex_new_test").hide(); 
     } 

     setTimeout(refresh, 1000); 
    } 
</script>

來源

2013-07-14 Zvîncă Alin Ionuț

什麼返回getimp.php，實際分鐘，秒？將只與一個$ .get（）調用更加一致 – Siot

我想你的問題是，每次你用setInterval刷新你的頁面時，你都會產生另一個setTimeout鏈，而不會清除前一個。

嘗試保存您的timeoutId並將其清除爲倒計時代碼中的第一件事。像這樣的東西應該工作：

<? 
$query=q_return("SELECT nume, cod, data, MINUTE(data_start) as minute, data_start FROM chestionare WHERE data_start>date_sub(now(), interval 2 minute)");?> 

<script> 
var timp_c="<?=$query['minute'];?>"; 
    var sec, 
     min, 
     timeoutId; 
    $.get('<?=return_url("php/getimp.php");?>', { k: "sec" }).done(function(data){sec=data;}); 
    $.get('<?=return_url("php/getimp.php");?>', { k: "min" }).done(function(data){min=data;}); 

    if (timeoutId) { 
     clearTimout(timeoutId); 
    } 

    timeoutId = setTimeout(refresh, 1000); 

    function refresh(){ 
     if(sec>=1){ 
      sec=sec-1; 
     }else{ 
      min=min-1; 
      sec=59; 
     } 

     if(sec<10){ 
      $("span#ex_start_timp_ramas_sec").each(function(){ 
       $(this).html("0"+sec); 
      }); 
     }else{ 
      $("span#ex_start_timp_ramas_sec").each(function(){ 
       $(this).html(sec); 
      }); 
     } 

     $("span#ex_start_timp_ramas_min").each(function(){ 
      $(this).html(min); 
     }); 

     if(sec==0 && min==0){ 
      //$("#ex_click_final").trigger('click'); 
      clearInterval(t); 
      $("#ex_new_test").hide(); 
     } 

     timeoutId = setTimeout(refresh, 1000); 
    } 
</script>

來源

2013-07-14 07:33:20

我覺得這裏的問題是，你做兩個Ajax請求，之後要開始計時，但這些要求需要時間來執行，因爲他們是異步的，這可以解釋你看到的結果。

$.when()救援：

var $getsec = $.get('<?=return_url("php/getimp.php");?>', { k: "sec" }), 
$getmin = $.get('<?=return_url("php/getimp.php");?>', { k: "min" }); 

$.when($getsec, $getmin).done(function($sec, $min) { 
    min = $min[0]; // [0] = data 
    sec = $sec[0]; 
    // start refresh 
    setTimeout(refresh, 1000); 
});

來源

2013-07-14 08:00:17

Javascript setTimeout裏面setInterval

回答

相關問題