javascript - clearInterval 未清除 setInterval

Question

我制作了一个带有计时器的内存游戏，从 10 分钟开始，每秒倒计时到 0。该函数仅调用一次，并具有以下 setInterval 函数:

game.countdown = setInterval(function() {
                    if(game.timeLeft <= 0){
                        gameEnded = true;
                    }

                    if(!gameEnded){
                        // lower one second
                        game.timeLeft--;

                        var timespan = document.querySelector('.timeleft');

                        var minutes =  pad(Math.floor((game.timeLeft / 60)),2 );
                        var newSeconds =  pad(Math.floor(game.timeLeft - (minutes * 60)),2 );

                        function pad(num, size) {
                            var s = num+"";
                            while (s.length < size) s = "0" + s;
                            return s;
                        }

                        var niceTime = minutes + ":" + newSeconds;

                        timespan.innerHTML = niceTime;

                        // Then alter time bar on .innertimer
                        // Calculate percentage starting at 0%
                        var percentageDone = (Math.floor((10*60 - game.timeLeft) / (10*60) * 10000) / 100);
                        $(".timer").css({"background": "-webkit-linear-gradient(left, white " + percentageDone + "%, green " + percentageDone + "%)"});
                    }
                }, 1000);

我将 setInterval 存储在对象游戏中的变量名称倒计时下。当游戏结束时，我调用另一个具有clearInterval的函数:

clearInterval(game.countdown);

然后，当进入下一个关卡时，它会再次调用 setInterval 函数并将其再次存储在 game.countdown 中。但现在每一秒需要 2 秒。下一关3秒。您可以看到有多个 setInterval 在工作，因为它不是同时完成的。

希望有人能真正帮助我解决这个问题。

Answer 1

我为解决该问题所做的工作如下。仅当满足以下条件时才会调用间隔:

if (undefined == game.countdown){

这样，如果定义了倒计时，它就会再次调用它。由于我将 game.timeLeft 存储在函数本身中，所以我可以重新填充 game.timeLeft。