Clear APIの呼び出しでClearIntervalが機能しません（ただし、ときどきのみ）

Question

投稿された可能性のある新しいコンテンツがあるかどうかを4秒ごとにデータベースに問い合わせるはずのこの機能があります。私はリターンを取って、サーバーから戻ってきたものから作られた動的なhtmlでフィードをリフレッシュします。これはすべて素晴らしいです。

私の問題は、htmlの一部として、コンテンツの一部をスライドさせて、そのコンテンツとは異なる削除、コピー、コメントなどのオプションを与えることができるオプショントレイがあることです。彼らがトレイを飛ばしたときに、間隔タイマーをクリアして、フィード内のhtmlをリフレッシュしないようにします（トレイを外す）。

他の問題は、ユーザはので、私はそれをすべてを処理するために、この機能を思い付い同時に開いて、複数のトレイを持つことができるということです。

function setTimers(status) 
{ 
    var timerGetContent = null; 
    if(status == "login") 
    { 
     tray_count = 0; 
     timerGetContent = null; 
     timerGetContent = setInterval(getContent,4000); 
     alert("inside login"); 
    } 
    else if(status == "negitive") 
    { 
     tray_count--; 
     if(tray_count == 0 && timerGetContent == null) 
     { 
      timerGetContent = setInterval(getRecentContent,4000); 
      alert("inside negitive"); 
     } 
    } 
    else if(status == "positive") 
    { 
     tray_count++; 
     clearInterval(timerGetContent); 
     timerGetContent = null; 
     alert("inside positive") 
    } 

} 

ので、ユーザが飛び出すためにボタンを押したときトレイにはsetTimerが呼び出され、それ以外の操作を行う前に正の値を渡してから、トレイを閉じるためにボタンを押したときにsetTimerと呼び、無視します。私はコールがうまく動作し、正しいパラメータが渡されていることを知っていますが、何が押されているかによって関数の右部分に入ることさえ知っていますが、間隔がクリアされず、私がやります。これを何時間も働いていて、まったく困惑しています。

編集： var timerGetContentをグローバル変数として機能外にしようとしました。これには同じ問題がありました。

EDIT2：setTimers関数を呼び出す 機能：この関数は、ポップアップしている間に

function slide_out(event) 
{ 
    clicked_element = document.getElementById(event.srcElement.id); 
    var re_clicked = new RegExp(clicked_element.className, "g"); 
    if(clicked_element.className == "options-bar slide-out") 
    { 
     BACKGROUND.setTimers("positive"); 
     clicked_element.className = clicked_element.className.replace(re_clicked, ''); 
     clicked_element.className += "options-bar slide-out open"; 
    } 
    else 
    { 
     clicked_element.className = clicked_element.className.replace(re_clicked, ''); 
     clicked_element.className += "options-bar slide-out"; 
     BACKGROUND.setTimers("negitive"); 
    } 

もうひとつ、setTimers機能が拡張の背景ファイルです。

Answer 1

Femiが以前に提案したように、ここでの主な問題はスコープであった。 はでなければなりません。var timerGetContent = null;は関数宣言の外に移動してください。また、最初の条件がstatus == "login"で論理エラーが発生しました。最初にクリアすることなくtimerGetContentのintervalIDをnullに設定していました。

したがって、setTimers("positive");を呼び出すことなくsetTimers("negitive");を呼び出してからsetTimers("login");を呼び出した場合、最初にその間隔をクリアすると、少なくとも1つのインターバルが常に存在します。

私はあなたの関数がテストのためにconsole.logステートメントを呼び出す置き換え：

var tray_count = 0; 
var timerGetContent = null; 
function setTimers(status) { 
    if(status == "login") { 
     tray_count = 0; 
     // Setting the intervalID to null will NOT clear the interval 
     // If we do not clear the interval, calling setTimers('login') 
     // will create a new interval and make previous interval 
     // "unclearable" every time it is called 
     clearInterval(timerGetContent); 
     timerGetContent = null; 
     timerGetContent = setInterval(function() { 
      console.log('login intervalling') 
      },400); 

    } else if(status == "negitive") { 
     tray_count--; 
     if(tray_count == 0 && timerGetContent == null) { 
      timerGetContent = setInterval(function() { 
       console.log('negitive intervalling') 
      },400); 
      alert("inside negitive"); 
     } 
    } else if(status == "positive") { 
     tray_count++; 
     clearInterval(timerGetContent); 
     // calling clearInterval does not actually unset the intervalID variable 
     // so we need to set it to null manually 
     timerGetContent = null; 
     timerGetBlasts = null; 
    } 

} 

アップデート2014年7月14日：

Answer 2

var timerGetContent = null;を関数外に移動して、setTimersの呼び出しの間に存続するようにしてください：今は関数のローカルです。

Answer 3

--cbarrickの書式た誤植を修正しました私は、グローバルを持っているあなたをお勧めしますタイマーIDの配列/オブジェクト。新しいタイマーを作成するたびにプッシュし、逆も同様です。

私のテイク：

timers = {}; 

function slide_out(event) { 
    clicked_element = document.getElementById(event.srcElement.id); 

    var re_clicked = new RegExp(clicked_element.className, "g"); 
    if (clicked_element.className == "options-bar slide-out") { 
    BACKGROUND.setTimers("positive", clicked_element.id); 
    clicked_element.className = clicked_element.className.replace(re_clicked, ''); 
    clicked_element.className += "options-bar slide-out open"; 

    } else { 
     clicked_element.className = clicked_element.className.replace(re_clicked, ''); 
     clicked_element.className += "options-bar slide-out"; 
     BACKGROUND.setTimers("negitive", clicked_element.id); 
    } 

function setTimers(status, elementId) { 
    var timerGetContent = null; 
    if (status == "login") { 
    tray_count = 0; 
    timerGetContent = null; 
    timerGetContent = setInterval(getContent, 4000); 
    timers[elementId] = timerGetContent; 
    alert("inside login"); 
    } else if (status == "negitive") { 
     tray_count--; 
     if (tray_count == 0 && timers[elementId] == undefined) { 
     timerGetContent = setInterval(getRecentContent, 4000); 
     timers[elementId] = timerGetContent; 
     alert("inside negitive"); 
     } 
    } else if (status == "positive") { 
     tray_count++; 
     clearInterval(timers[elementId]); 
     delete timers[elementId]; 
     timerGetContent = null; 
     alert("inside positive") 
    } 
} 

私はインデント

乾杯の迅速な対応のための