javascript - 停止循环函数setTimeout

Question

我有一个使用 setTimeout 的循环，如下所示:

<button onclick="clickStop()">stop</button>

<script type="text/javascript">
    let i = 0;
    let sett;
    function timeOut(counter) {   
        sett = setTimeout(function () {
            $.get("./test3.php", {data_id: counter}, (data) => {
                console.log(data);
                i++;
                timeOut(i);
            });
        }, 1000);
        if(counter >= 10) {
            clearTimeout(sett);
            alert("Done!");
        }
    }
    timeOut(i);
    function clickStop() {
        clearTimeout(sett);
    }
</script>

但是当我点击停止按钮时它不起作用，帮帮我!!

Answer 1

您可以清除超时并设置一个标志，该标志将提醒 $.get 中的回调它在返回时不应调用 timeOut():

let i = 0;
let sett;
let active = true   // should the loop continue?
function timeOut(counter) {  
    if (counter < 10){
      sett = setTimeout(function () {
        $.get("./test3.php", {data_id: counter}, (data) => {
            console.log(data);
            i++;
            if (active) timeOut(i); // only if active
        });
      }, 1000);
    } else {
      alert("Done!");
    }
}
timeOut(i);
function clickStop() {
    active = false      // stop loop
    clearTimeout(sett); // and clear current timeout
}