たsetIntervalとてclearInterval

Question

私はこのmessage();機能があります。

function message(kind, text){ 
    if(fadeOutDelay != undefined){ 
     clearInterval(fadeOutDelay); 
    } 
    $("#message").show(); 
    $("#message").attr('class',kind); 
    $('#message').text(text); 
    var fadeOutDelay = setInterval(function(){ 
     $("#message").fadeOut(2000); 
    },10000); 
} 

問題は、私は機能は、最新のメッセージの退色を防止するための再実行されたときに間隔をクリアしようとしているということです。私はメッセージを生起させ続ける能力を必要とし、互いに10秒以内であればフェードが起こらないようにしたい。基本的に、この機能が実行されているときにsetIntervalが発生している場合は、キャンセルしたいと思います。

Answer 1

fadeOutDelayは、他の関数呼び出しの対象外です。あなたが代わりにグローバル変数を使用することができます：私が正しくあなたの質問を理解していれば

var fadeOutDelay; 
function message(kind, text){ 
    if(fadeOutDelay != undefined){ 
     clearInterval(fadeOutDelay); 
    } 
    $("#message").show(); 
    $("#message").attr('class',kind); 
    $('#message').text(text); 
    fadeOutDelay = setInterval(function(){ 
     $("#message").fadeOut(2000); 
    },10000); 
} 

Answer 2

この

var fadeOutDelay = null; 
function message(kind, text){ 

    if(fadeOutDelay){ 
     clearInterval(fadeOutDelay); 
     fadeOutDelay = null; 
    } 

    $("#message").show(); 
    $("#message").attr('class',kind); 
    $('#message').text(text); 
    fadeOutDelay = setInterval(function(){ 
     $("#message").fadeOut(2000); 
    },10000); 
} 

Answer 3

を試してみてください、私はあなたは自分のfadeOutDelay VARグローバルを設定することがあると思います。

var fadeOutDelay; //global var. 

function message(kind, text){ 
    if(fadeOutDelay != undefined){ 
     clearInterval(fadeOutDelay); 
    } 
    $("#message").show(); 
    $("#message").attr('class',kind); 
    $('#message').text(text); 
    fadeOutDelay = setInterval(function(){ 
     $("#message").fadeOut(2000); 
    },10000); 
} 

Answer 4

fadeOutDelay変数は、この関数のスコープの外で宣言する必要があります

var fadeOutDelay = null; 

function message(kind, text){ 
    if(fadeOutDelay) { 
     clearInterval(fadeOutDelay); 
    } 
    $("#message").show(); 
    $("#message").attr('class',kind); 
    $('#message').text(text); 
    fadeOutDelay = setInterval(
     function() { $("#message").fadeOut(2000); }, 
     10000 
    ); 
} 

Answer 5

は、ここにはグローバル変数でそれを行う方法です。

そして、私はあなたが表示されている各メッセージに対して1回だけ発動させたいので、setIntervalではなくsetTimeoutを使いたいと思います。

データオブジェクトとクラスが表示される前にデータオブジェクトとクラスが設定され、セレクタを何度も繰り返し実行するのではなく、ローカル変数にjQueryオブジェクトを一度保存​​するように、メッセージオブジェクトの初期操作を並べ替えました。

function message(kind, text){ 
    var m = $('#message'); 
    m.text(text); 
    m.attr('class', kind); 
    m.show(); 
    var timer = m.data("timer");   // get previous timer value 
    if (timer) { 
     clearTimeout(timer);    // clear timer, if still running 
    } 
    timer = setTimeout(function() { 
     m.fadeOut(2000); 
     m.data("timer", null);  // clear stored timer 
    },10000); 
    m.data("timer", timer);   // store timer as data on the object 
}