exit mulitpleクリック機能を持つループの場合

Question

私は3つのforループを持っています。

function slow() { 
    for (var j = 0; j < 1000000; j++) { 
    (function main(j) { 
     setTimeout(function() { 
     $(e).trigger("play"); 
     $(e).trigger("rerender"); 
     $('#Generation').text('Generation: ' + j); 
     }, 1000 * j/2); 
    }(j)); 
    } 
}; 

残りの二つforループが反復差の速度を除いて同一です。

私は、これらの3つのループを単一のjQueryクリック機能で終了/中断したいと考えています。 idが 'stop'のボタンをクリックすると

どうすればいいですか？

は、これは私のpen

Answer 1

はこれを試して..です

<script> 
     $(function(){ 

      var Break = false; // Declare this above your for loop function 

      $("#btnStop").click(function(e){ 
       e.preventDefault(); 
       Break = true; 
      }); 

      function slow() { 
      for (var j = 0; j < 1000000; j++) { 
       if(Break){break;} // Check this for each 3 for loop 
       (function main(j) { 
        setTimeout(function() { 
        $(e).trigger("play"); 
        $(e).trigger("rerender"); 
        $('#Generation').text('Generation: ' + j); 
        }, 1000 * j/2); 
       }(j)); 
       } 

       // I'm repeating same for loop for illustration. 
       for (var j = 0; j < 1000000; j++) { 
       if(Break){break;} // Check this for each 3 for loop 
       (function main(j) { 
        setTimeout(function() { 
        $(e).trigger("play"); 
        $(e).trigger("rerender"); 
        $('#Generation').text('Generation: ' + j); 
        }, 1000 * j/2); 
       }(j)); 
       } 

       for (var j = 0; j < 1000000; j++) { 
       if(Break){break;} // Check this for each 3 for loop 
       (function main(j) { 
        setTimeout(function() { 
        $(e).trigger("play"); 
        $(e).trigger("rerender"); 
        $('#Generation').text('Generation: ' + j); 
        }, 1000 * j/2); 
       }(j)); 
       } 
      }; 
     }) 
    </script>