SetInterval 运行 即使在我清除它之后

Question

我在解决 setInterval 的问题时遇到了一些麻烦。

我有一个函数，当我点击我网站上设置 var pass = 1 的元素时运行；

如果你查看 color1();有一个设置的间隔，当 pass > 0 时会自行清除；所以如果通过= 1；然后它应该清除自己，确实如此，但只有在 运行 间隔之后再清除一次。

所以它 - 运行 setInterval，清除 setInterval，然后运行 ​​setInterval 中的其余代码。我需要的是让 setInterval 在没有 运行 代码的情况下再次清除。

提前致谢

function color1() {
      var pass = 1;
      var counter = 2;
      var animationSpeed = 800;

      var $colorContent = '.color-container-1 .color-content-container'

      var colorInterval = setInterval(function() {

        if (pass > 0) {
          clearInterval(colorInterval);
        }

        $($colorContent).fadeOut(0);
        $(($colorContent + '-' + counter)).fadeIn(animationSpeed);
        ++counter

        if (counter === $($colorContent).length + 1) {
          counter = 1;
        }

      }, 3000);
    }

Answer 1

应该像下面这样，你应该return这个函数。这里你已经清除了间隔但是你还没有停止执行

var colorInterval = setInterval(function() {

    if (pass > 0) {
      clearInterval(colorInterval);
      return; //stop here so that it doesn't continue to execute below code
    }

    $($colorContent).fadeOut(0);
    $(($colorContent + '-' + counter)).fadeIn(animationSpeed);
    ++counter

    if (counter === $($colorContent).length + 1) {
      counter = 1;
    }

  }, 3000);