如何重新排列此代码,以便我的 setInterval 无限停止循环

how can I rearrange this code so my setInterval stops looping infinitely?

本文关键字:setInterval 我的 无限 循环 排列 何重新 代码      更新时间:2023-09-26

我正在尝试用 HTML/Javascript 制作一个简单的翻转卡/内存匹配(如超级马里奥兄弟 3(游戏,并且使用 setInterval 命令遇到了一个小问题。

以下是完整代码的链接:http://jsfiddle.net/msfZj/这是它的主要问题/主要逻辑:

if(click == 2)  //denotes two cards being clicked
{
    if(flippedArray[1].src === flippedArray[0].src)  // if click 1 == click 2 then refer to function 'delayMatch' which sets click 1 and 2 cards to not be displayed
    {
        window.setInterval(function() { delayMatch() }, 500);       
        console.log("EQUAL");
    }
    else
    {
        window.setInterval(function() { delayNoMatch() }, 500); // if click 1 != click 2 then display card.png 
        console.log("NOT EQUAL");
    }
        function delayMatch()  //function for matching pairs
    {
    flippedArray[0].style = "display:none;";
    flippedArray[1].style = "display:none;";
    }
        function delayNoMatch()  //function for non-matching pairs
    {
    flippedArray[0].src = "card.png";
    flippedArray[1].src = "card.png";   
    }

    click = 0;  // when clicked two cards set click back to zero    
}

我点击的前两张卡总是有效的:但从那时起,setInterval 每 500 毫秒以无限循环一遍又一遍地运行该函数。

如果有人能指出我如何正确地做到这一点的正确方向,我将非常感激。

非常感谢您的时间。

看起来你需要setTimeout,它只运行一次?

window.setTimeout(function() { delayMatch() }, 500);       

否则,您需要使用 clearInterval(i) 清除区间,但首先使用 setInterval 的返回值设置 "i":

var i = window.setInterval(function() { delayMatch() }, 500);

这是一个演示(我为JSFiddle进行了一些JQuerization(。

你会想要使用 setTimeout(( 而不是 setInterval((

当你使用setTimeout时,一个方便的函数是clearTimeout。假设您想设置一个计时器,但可能想要一个按钮来取消

var timer = setTimeout(fn,1000);
//later maybe
clearTimeout(timer);