爲什麼clearInterval沒有清除setInterval定時器

我已經創建了一個簡單的Timer服務。在定時服務中，我每分鐘都在監視用戶。爲什麼clearInterval沒有清除setInterval定時器

頁面加載時，已經設置了3分鐘以獲得註銷警報，並且在1分鐘之前這意味着2分鐘獲得引導警告，同時單擊繼續按鈕，它將清除當前間隔並再次分配3分鐘，否則，在3分鐘後獲得註銷警告以註銷。

第一次它的工作正常，同時點擊繼續按鈕，它不會重新分配用戶的值。對於第3分鐘本身，它顯示註銷。

代碼中哪裏出錯。

<!DOCTYPE html> 
<html> 

    <head> 
    <link data-require="[email protected]" data-semver="4.0.0-alpha.4" rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.4/css/bootstrap.min.css" /> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.js" ></script> 
    <script data-require="[email protected]" data-semver="3.3.6" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
    <link rel="stylesheet" href="style.css" /> 
    <script src="script.js"></script> 
    </head> 

    <body onload="TimerService()"> 
    <p id="demo"></p> 
    <h1 id="title">Javascript timer problem</h1> 
    <div id="modeldialog"></div> 
    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" data-backdrop="static"> 
     <div class="modal-dialog"> 
     <div class="modal-content"> 
      <div class="modal-header"> 
      <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> 
      <label class="session-expiration"> 
       <span>Session Expiration</span> 
       <img src="~/Images/Warning_Alert_Icon_26.png" /> 
      </label> 
      </div> 
      <div class="modal-body"> 
      <div class="session-message"> 
       <p class="time-message">your Session will expire in         <i id="timer" class="fa fa-clock-o"> 
        <span class="expire">Minutes </span> 
       </i> 

.click proceed to stay Login.</p> 
       <p class="time-message"> 
       <b>Click Proceed to stay Login.</b> 
       </p> 
      </div> 
      </div> 
      <div class="modal-footer"> 
      <button type="button" class="btn btn-default" onclick="LogOut()">Logout</button> 
      <button type="button" class="btn btn-primary" onclick="proceed()">Proceed</button> 
      </div> 
     </div> 
     </div> 
    </div> 
    </body> 

</html>

的javascript：

function proceed() 
{ 
$("#myModal").toggle(); 
TimerService(); 
} 

function load(){ 
    alert(" if click proceed , timer service extended another 3 minutes else logout after 3 "); 
    $("#myModal").modal(); 

    } 

function TimerService() 
    { 
    alert("TimerService"); 
    var timer = false; 
    clearInterval(timer); 
    if (timer == false) { 
     var lastDigestRun = new Date(); 
      lastDigestRun = Date.now(); 
      var s = lastDigestRun + 3 * 60 * 1000; 
      // for reference 
      document.getElementById("demo").innerHTML = new Date(s); 
      console.info("Your logout time +" + new Date(s)); 

       timer=setInterval(function() {     
        var now = Date.now(); 
        var displaytime = now - lastDigestRun > 2 * 60 * 1000; 

        if (now - lastDigestRun > 2 * 60 * 1000) {      
         load(); 
         } 

         if (now - lastDigestRun > 3 * 60 * 1000) { 
         alert("logout"); 

         }  
       }, 60 * 1000); 

     } 
}

Plunker演示：

https://plnkr.co/edit/qwNJF648LIvUUNT3IMkc?p=preview

來源

2017-01-09 Mohamed Sahir

您清除之前創建'的setInterval（）'' –

僅clearInterval'清除'setInterval'定時器不'setTimeout'的。 – Bergi

@Jyothi Babu Araja然後我必須清除，因爲第一次，需要運行計時器加載，點擊後，再次需要重新分配計時器 –

你需要調用window.clearTimeout在timer變量取消超時。

例如，在你的TimerService()

$(document).on('click', function() { 
    clearTimeout(timer) 
}

，並使用setTimeout()代替setInterval()。它更適合你的情況。如果你想刪除保持使用setInterval()，更新上面的代碼clearInterval()而不是clearTimeout()。

來源

2017-01-09 14:43:36 motanelu

對不起，我已經更新了我的問題，我已經使用了明確的時間間隔，但是它沒有清除出錯的部分的代碼。 –

這裏出了點問題仍然無法清除，如果感興趣看這裏github.com/MohamedSahir/UserSession - –

你有下面的代碼位：

var timer = false; 
clearInterval(timer); 
if (timer == false){

出於顯而易見的原因，這總是會評估爲真。此外，clearInteval不會做任何事情，因爲它是所謂虛假

來源

2017-01-09 14:56:22 Orangesandlemons

這裏出了點問題不能清除，如果感興趣看這裏https://github.com/MohamedSahir/UserSession –

爲什麼clearInterval沒有清除setInterval定時器

回答

相關問題