Javascript 如何使这个函数在Jquery循环中运行5次

该功能包括在按下空格键时更改我身体的背景，因为你可以看到身体在5秒后是否为黄色，它将变为蓝色，如果在5秒后为蓝色，它将变为红色

我想让这个函数循环5次

这是我的密码：

$(document).ready(function() {
    $(document).keypress(function(e) {
        if (e.which == 32) {
            function changeColor() {
                if ($('body').hasClass('yellow')) {
                    $('body').removeClass('yellow');
                    $('body').addClass('blue');
                } else if ($('body').hasClass('blue')) {
                    $('body').removeClass('blue');
                    $('body').addClass('red');
                }
            }
        }
        setInterval(changeColor, 5000);
    });
});

---

从间隔和函数中取出一个计数器，然后使用该计数器：

var times2toggle = 5;
var toggleColor = setInterval(changeColor, 5000);

function changeColor() {
    if( times2toggle--==0 ){ clearInterval( toggleColor ); }
    $('body').toggleClass('yellow blue');
}

---

我还向函数中添加了

.toggleClass（）

。这与您的代码相同，但更易于阅读。如果以黄色开头，则toggle类将关闭黄色，打开蓝色。

您需要计算执行间隔的次数，然后在满足最大次数

n

后调用

clearInterval

为了避免使用全局变量，最好创建一个调用间隔的新方法：

function setIntervalTimes(callback, milliseconds, times)
{
    var i=0;
    var interval = window.setInterval(function()
    {
       callback();

       if ( ++i === times ) {
           window.clearInterval(interval);
       }
    }, milliseconds);
}

现在您可以像这样调用

setInvervalTimes（）

：

function changeColor() {
  // Your logic...
}

$(document).ready(function() {
  $(document).keypress(function(e) {
    if (e.which == 32) {
      // Perform your logic 5 times in 5 second intervals
      setIntervalTimes(function () {
        changeColor();
      }, 5000, 5);
    }
  });
});