SetIntervalをクリアしても実行中

Question

私はsetIntervalで問題を解決するのに少し問題があります。

私はvar pass = 1を設定するWebサイトの要素をクリックすると実行される関数を持っています。

color1（）; pass> 0のときにそれ自身をクリアするSet Intervalがあります。そうすれば、パス= 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);