通過單擊事件停止循環jQuery

我正在尋找一種方法來停止單擊事件（排序緊急按鈕）的循環。如果你點擊該按鈕，它應該立即停止。通過單擊事件停止循環jQuery

//基本思想

$.each(someArray, function(index, value){ 
    setTimeout(function(){ 
      console.log(index); 
    },5000*index); 
}); 


$('#panic-button').click(function(){ 
    //the code that should stop the looping 
}):

來源

2012-07-12 user759235

一旦循環啓動，您就不能使用click處理程序中斷$.each循環。 JavaScript執行是單線程的，所以在循環完成後，處理程序最多隻能在線程下次免費時排隊等待。

然而，當定時器是異步執行的，你可以通過保持和清除他們的每一個ID的取消它們：

var timeouts = []; 

$.each(someArray, function(index, value){ 
    timeouts.push(setTimeout(function(){ 
      console.log(index); 
    },5000*index)); 
}); 


$('#panic-button').click(function(){ 
    $.each(timeouts, function (_, id) { 
     clearTimeout(id); 
    }); 

    timeouts = []; 
}):

來源

2012-07-12 00:22:06

非常感謝！ – user759235 2012-07-12 12:22:59

你的回答很簡單：

添加var $theTimeout =在setTimeout前面和你的click處理清除：clearTimeout($theTimeout)。

http://www.w3schools.com/js/js_timing.asp

來源

2012-07-12 00:13:50

這是行不通的，有創建多個計時器，因爲它是一個'each'構造內被取消環。你需要將它們保存在一個數組中並清除所有的數據。 – Ben 2012-07-12 00:18:58

的$。每個（外部創建函數的返回值），並使用一個標誌變量來確定按鈕是否被點擊了。我通常使用「窗口」聲明全局函數和變量。

var panicButtonClicked = false; 
window.panicButtonClicked = panicButtonClicked; 
var timeouts = []; 
window.timeouts = timeouts; 

$.each(someArray, function(index, value){ 
    if(!panicButtonClicked) 
    { 
     timeouts.push(setTimeout(function(){ 
      console.log(index); 
     }, 5000*index)); 
    } 
}); 

$('#panic-button').click(function(){ 
    //the code that should stop the looping 
    panicButtonClicked = true; 
    $.each(timeouts, function (_, id) { 
     clearTimeout(id); 
    }); 
});

我已經包含由Jonathan Lonowski給出的for循環在我的編輯中。這個想法是相似的，除了你需要一個額外的變量來防止你的初始循環執行。這是否能解決您的問題？

來源

2012-07-12 00:20:08

如果你想有一個循環in the background，你可以終止你必須模擬這是因爲js基本上是單線程的，並且你的循環將會阻塞，直到它完成，你就可以點擊一個按鈕。

下面是一個例子，它使用的setTimeout模擬，可以通過點擊

FIDDLE

來源

2012-07-12 00:35:51 Musa

通過單擊事件停止循環jQuery

回答

相關問題