在遞歸函數中停止settimeout

Question

我的問題是我無法停止計時器。

我有這個方法來設置這個論壇的超時。 它應該將標識符存儲在全局變量中。 我意外地發現，在我隱藏“mydiv”之后它仍在運行。

我現在還需要知道，如果遞歸函數創建多個實例，或者僅為超時創建一個實例。 因為首先我認為它每次都會覆蓋“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中的匿名函數很棒， 如果要運行邏輯內聯，更改函數內部的'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 2

我認為你誤解了'setTimeout'和'clearTimeout'。

如果要設置要在以后取消的計時器，請執行以下操作：

foo = setTimeout(function, time);

然后打電話

clearTimeout(foo);

如果你想取消那個計時器。

希望這可以幫助！

Answer 3

由於編寫的mytimer是一個永遠不具有超時標識符值的函數，因此您的clearTimeout語句將無法實現。

我根本沒有看到任何遞歸，但你需要存儲值setTimeout返回給你，如果你需要將它與多個潛在事件配對，你需要將它存儲在一個你可以查找的鍵值上 - 就像一個元素或許也許？

Answer 4

你不能停止所有創建的函數，將函數轉換為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);

Answer 5

這是一個簡單的偽代碼，用於控制和調節遞歸的setTimeout函數。

    const myVar = setTimeout(function myIdentifier() {

    // some code

    if (condition) {
        clearTimeout(myIdentifier)
    } else {
        setTimeout(myIdentifier, delay); //delay is a value in ms.
    }

}, delay);

Answer 6

（功能（）{

$('#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 7

正如上面提到的，為什么這個代碼不工作的主要原因是，你passingt他做錯事到clearTimeout調用-你需要存儲的返回值setTimeout叫你做updateFunction並通入clearTimeout 這一點 ，而不是函數引用本身。

作為改進的第二個建議 - 只要你有一個你稱之為遞歸超時函數的東西，你最好使用setInterval方法，該方法定期運行一個函數直到被取消。 這將實現與您嘗試使用updateFunction方法相同的功能，但它更干凈，因為您只需要在延遲函數中包含“do stuff”邏輯，並且它可能更updateFunction ，因為您不會創建嵌套關閉。 加上它是正確的做法，它必須要有所作為，對嗎？ :-)