再帰関数でsettimeoutを停止する

Question

私の問題は、タイマーを停止できないことです。

私はこのフォーラムからタイムアウトを設定するのにthis methodでした。 識別子をグローバル変数に格納することになっていました。 偶然、「mydiv」を隠してからまだ実行中であることがわかりました。

再帰関数が複数のインスタンスを作成する場合、またはタイムアウトのインスタンスを1つだけ作成する場合は、これも知っておく必要があります。最初はいつも "var mytimer"を上書きすると思っていたからです。 今私は確信していません。

タイマーを止めるにはどんな方法がありますか？

var updatetimer= function() { 
//do stuff 
     setTimeout(function(){updatetimer();}, 10000); 

}//end function 


//this should start and stop the timer 
$("#mybutton").click(function(e) { 
     e.preventDefault(); 
     if($('#mydiv').is(':visible')){ 
        $('#mydiv').fadeOut('normal'); 
      clearTimeout(updatetimer); 

     }else{ 
        $('#mydiv').fadeIn('normal'); 
        updatetimer(); 
       } 
}); 

おかげで、リチャード

Answer 1

私は 'setTimeoutを' あなたは誤解だと思うと 'てclearTimeout'。

あなたは後でキャンセルするタイマーを設定したい場合は、のような何かをする：あなたはそのタイマーをキャンセルしたい場合は、その後

clearTimeout(foo); 

を呼び出す

foo = setTimeout(function, time); 

。

希望すると便利です。

Answer 2

mytimerはタイムアウト識別子の値を決して持っていない関数なので、clearTimeout文は何もしません。

私はここに全く再帰を見ませんが、値を保存する必要があります。setTimeoutがあなたを返します。これを複数の潜在的なイベントとペアにする必要がある場合は、ルックアップ - おそらく要素IDのようなもの？

Answer 3

上述したように、このコードは動作していない主な理由は、あなたがclearTimeoutコールに彼間違ったことpassingtだということです - あなたはupdateFunctionにあなたが作るsetTimeout呼び出しの戻り値を格納し、を渡す必要がありますこのを関数参照自体の代わりにclearTimeoutに挿入します。

第2の提案として、再帰的なタイムアウト関数と呼ばれるものがある場合は、キャンセルするまで一定の間隔で関数を実行するsetIntervalメソッドを使用する方がよいでしょう。これは、あなたのupdateFunctionメソッドでやろうとしているのと同じことを実現しますが、遅延関数にdo stuffロジックを含めるだけで済むので、より洗練されています。そして、ネストを作成しないので、閉鎖する。プラスそれは何かを数えなければならない正しい方法ですよね？ :-)

Answer 4

私はほとんどの人がこれがうまくいかない理由に陥っていると思いますが、私はあなたに最新のコードを提供すると思いました。それはあなたのものとほとんど同じですが、タイムアウトを変数に代入してクリアすることができます。

また、インラインロジックを実行したい場合は、の匿名関数が有効です。関数内でthisの値を変更するか、関数にパラメータを渡します。関数を呼び出すだけであれば、関数の名前を最初のパラメーターとして渡すだけで十分です。

var timer = null; 

var updatetimer = function() { 
    //do stuff 

    // By the way, can just pass in the function name instead of an anonymous 
    // function unless if you want to pass parameters or change the value of 'this' 
    timer = setTimeout(updatetimer, 10000); 
}; 

//this should start and stop the timer 
$("#mybutton").click(function(e) { 
    e.preventDefault(); 
    if($('#mydiv').is(':visible')){ 
     $('#mydiv').fadeOut('normal'); 
     clearTimeout(timer); // Since the timeout is assigned to a variable, we can successfully clear it now 

    } else{ 
     $('#mydiv').fadeIn('normal'); 
     updatetimer(); 
    } 
}); 

Answer 5

（関数（）{

$('#my_div').css('background-color', 'red'); 
$('#my_div').hover(function(){ 
var id=setTimeout(function() { 
    $('#my_div').css('background-color', 'green'); 
}, 2000); 

var id=setTimeout(function() { 
    $('#my_div').css('background-color', 'blue'); 
}, 4000); 
var id=setTimeout(function() { 
    $('#my_div').css('background-color', 'pink'); 
}, 6000); 

    }) 

$("#my_div").click(function(){ 
     clearTimeout(id); 

     }) 

}）（）;

Answer 6

あなたはinteadそのののsetIntervalに関数を変換する（同じロジックつまり、あなたの再帰関数を表す）と、それを停止し、作成されるすべての機能を停止することはできません。

// recursive 
var timer= function() { 
// do stuff 
    setTimeout(function(){timer();}, 10000); 
} 

同じロジックをするsetIntervalを使用して：

// same logic executing stuff in 10 seconds loop 
var timer = setInterval(function(){// do stuff}, 10000) 

はそれを停止します。

clearInterval(timer);