Javascript - clearInterval（）不起作用

Question

我需要帮助修复clearInterval()的错误。我在clearInterval()内定义了setInterval()。

我可以在clearInterval()内定义setInterval()吗？

＆＃13;

＆＃13;

function neha() {

    var timeleft = 5000;
    setInterval(
        function() {
            // Success
            document.getElementById("nehaSuccess").innerHTML = "I'm done, today I will eat sandwich";

            // Show countdown
            timeleft--;
            document.getElementById("countdowntimer").textContent = timeleft;
            if (timeleft <= 0) {
                clearInterval(); // how I do clearInterval
            }
        },
        5000
    );
    // Pending
    document.getElementById("nehaPending").innerHTML = "I'm working right now, I need 5 seconds";

}

neha();

＆＃13;

<ul>
    <li>Neha</li>
    <li>;( -
        <span id="nehaPending"></span>
        <span id="nehaCountdowntimer"> Time remaning:  </span>
    </li>
    <li>;) - <span id="nehaSuccess"></span> </li>
</ul>

＆＃13;

＆＃13;

＆＃13;

Answer 1

您需要存储setInterval标记，然后用它清除

var intervalId = setInterval(()=>{}, 50);
clearInterval(); // does nothing;
clearInterval(intervalId );// works fine

function neha() {
    var interval;
    var timeleft = 5000;
    interval =  setInterval(
        function() {
            // Success
            document.getElementById("nehaSuccess").innerHTML = "I'm done, today I will eat sandwich";

            // Show countdown
            timeleft--;
            document.getElementById("countdowntimer").textContent = timeleft;
            if (timeleft <= 0) {
                clearInterval(interval); // how I do clearInterval
            }
        },
        5000
    );
    // Pending
    document.getElementById("nehaPending").innerHTML = "I'm working right now, I need 5 seconds";

}

neha();

<ul>
    <li>Neha</li>
    <li>;( -
        <span id="nehaPending"></span>
        <span id="nehaCountdowntimer"> Time remaning:  </span>
    </li>
    <li>;) - <span id="nehaSuccess"></span> </li>
</ul>

Answer 2

你必须告诉clearInterval你要清除的间隔时间！ （它将是setInterval函数的返回值。

var myInterval = setInterval(function () {
    do_stuff();
    if (someCondition()) {
        clearInterval(myInterval);
    }
}, 5000);

Answer 3

您需要将timer传递给clearInterval，

var timer = setInterval(

和

clearInterval(timer);

您还需要使用正确的ID [{1}} 而不是nehaCountdowntimer

countdowntimer

<强>演示

＆＃13;

＆＃13;

document.getElementById("nehaCountdowntimer").textContent = timeleft;

＆＃13;

function neha() {

    var timeleft = 5000;
    var timer = setInterval(
        function() {
            // Success
            document.getElementById("nehaSuccess").innerHTML = "I'm done, today I will eat sandwich";

            // Show countdown
            timeleft--;
            document.getElementById("nehaCountdowntimer").textContent = timeleft; //observe this line
            if (timeleft <= 0) {
                clearInterval(timer); // how I do clearInterval
            }
        },
        5000
    );
    // Pending
    document.getElementById("nehaPending").innerHTML = "I'm working right now, I need 5 seconds";

}

neha();

＆＃13;

＆＃13;

＆＃13;

Answer 4

以下代码应该正常工作

 function neha() {

        var timeleft = 5000;
        var interval = setInterval(
            function() {
                // Success
                document.getElementById("nehaSuccess").innerHTML = "I'm done, today I will eat sandwich";

                // Show countdown
                timeleft--;
                document.getElementById("countdowntimer").textContent = timeleft;
                if (timeleft <= 0) {
                    clearInterval(interval); // how I do clearInterval
                }
            },
            5000
        );
        // Pending
        document.getElementById("nehaPending").innerHTML = "I'm working right now, I need 5 seconds";

    }

    neha();

Answer 5

函数'setInterval'返回一个数字，表示计时器的ID值。您将此ID与函数'clearInterval'一起使用以取消计时器。就像是： 'var timerHandle = setInterval（alert（“hello”），5000）; ... ... clearInterval（timerHandle）; //取消计时器'

有关设置间隔的详细信息：https://www.w3schools.com/jsref/met_win_setinterval.asp