清除Javascript時間間隔

-2

我正在對文件運行HTTP請求，並根據響應是「200」還是其他響應運行成功或錯誤功能。此請求每秒發生一次。清除Javascript時間間隔

我面臨的問題是當我得到很多錯誤響應時，他們都一起運行，最後一個不停止例如結束間隔開始一個新的。

紅燈開始閃爍得太快。誰能幫我嗎。我的代碼在下面，我現在一直在玩它幾個小時，但似乎無法達到它的底部。

var requestResponses = { 

    greenLight: $('.cp_trafficLight_Light--greenDimmed'), 
    redLight: $('.cp_trafficLight_Light--redDimmed'), 
    greenBright: 'cp_trafficLight_Light--greenBright', 
    redBright: 'cp_trafficLight_Light--redBright', 

    init: function (url) { 
     setInterval(function() { 
      requestResponses.getResponse(url); 
     }, 1000); 
    }, 

    successResponse: function() { 
     var redBright = requestResponses.redBright, 
      greenBright = requestResponses.greenBright; 
     requestResponses.errorCode = false; 
     requestResponses.redLight.removeClass(redBright); 
     requestResponses.greenLight.addClass(greenBright); 
    }, 

    errorResponse: function() { 
     requestResponses.runOnInterval(); 
    }, 

    runOnInterval: function() { 
     // clearInterval(runInterval); 
     var redBright = requestResponses.redBright, 
      greenBright = requestResponses.greenBright, 
      redLight = requestResponses.redLight; 
     requestResponses.greenLight.removeClass(greenBright); 
     var runInterval = setInterval(function() { 
      if (requestResponses.errorCode === true) { 
       redLight.toggleClass(redBright); 
      } 
     }, 400); 
    }, 

    getResponse: function (serverURL) { 
     $.ajax(serverURL, { 
      success: function() { 
       requestResponses.errorCode = false; 
       requestResponses.successResponse(); 
      }, 
      error: function() { 
       requestResponses.errorCode = true; 
       requestResponses.errorResponse(); 
      }, 
     }); 
    }, 

    errorCode: false 
} 

requestResponses.init('/status');

感謝您的幫助。

來源

2017-02-12 Harry

Javascript是一種事件驅動的語言。不要循環週期性地檢查事物。有些地方可以這樣做，但大多數時候要麼在需要時重複調用延遲函數（setTimeout），要麼使用回調會是更好的方法。

對請求使用setInterval，請考慮如果請求開始的時間比您的時間間隔長，會發生什麼情況。

在你的情況，你有兩個使用setInterval創建的循環。第一個是每1秒運行一次的請求。而不是使用setInterval的，你只能經過一個請求完成修改您的代碼運行setTimeout和執行其它任務之前重新運行下一個請求：

function runRequest(...) { 
    $.ajax(serverURL, { 
     ... 
     complete: function() { 
      setTimeout(runRequest, 1000); 
     } 
     ... 
    }); 
} 

function lightsOnOff() { 

    var redBright = requestResponses.redBright, 
     greenBright = requestResponses.greenBright, 
     redLight = requestResponses.redLight; 

    requestResponses.greenLight.removeClass(greenBright); 
    if (requestResponses.errorCode === true) { 
     redLight.toggleClass(redBright); 
    } 

} 
setInterval(lightsOnOff, 400);

來源

2017-02-12 11:09:55

我感謝您的幫助，但我現在的問題是光不會不斷閃爍，但僅限於每次請求。我需要燈光持續閃爍，而不是變慢或變快。 – Harry

然後這隻適用於你的第二個計時器。我將相應地編輯答案。 –

比倫特，我真的很感謝你的幫助，但我想我們可能會略微偏離頁面。我附上了一個小提琴，以便您可以看到我的問題。我測試了上面的代碼，但它似乎只在某種程度上起作用。如果你能幫忙，我會贊成你的答案並繼續前進。謝謝 https://jsfiddle.net/gtfyugg0/1/ – Harry

setInterval()方法一遍又一遍地重複自己，而不只是一次。然後，您的錯誤響應處理程序將調用創建另一個setInterval()的例程，依此類推。直到你有這麼多的進程運行，你會得到閃爍的紅燈問題。

解決方法是隻調用一次調用setInterval()調用的邏輯。或者，更好的是，使用setTimeout（）來調用例程。它一次運行，可能更適合您的使用。

來源

2017-02-12 11:01:07 rasmeister

清除Javascript時間間隔

回答

相關問題