1

I have a start button that when clicked runs a function that loops. How do I get a stopBTN.onClick to stop the running loop?

https://jsfiddle.net/vduxbnkj/

startBTN.onClick = function(){ runLoop(); }

function runLoop(){
    while(condition true){
        getFolderContentsLoop();
    }
}

function getFolderContentsLoop(){
    //loop through folders & files looking for .txt file and if "finished"
      delete files and folders
}
sbaden
  • 555
  • 3
  • 16
  • 30
  • Please use jsfiddle and show us the problem with your code / html – Marcus Brunsten Mar 20 '15 at 19:00
  • Loops run extremely quickly - what are you trying to accomplish with this? Maybe [`setInterval()`](https://developer.mozilla.org/en-US/docs/Web/API/WindowTimers/setInterval) is what you're after? – Scott Mar 20 '15 at 19:01
  • I've written a script that loops through a directory folder ("Batch Folder") looking for a text file. When it finds the text folder it reads it and looks for "Finished". If finished it deletes all files and folders associated. As long as there are folders and files in the "Batch Folder" it will continue to loop. I was hoping to be able to stop it when I wanted. – sbaden Mar 20 '15 at 19:29
  • I've just updated my original code to show more info – sbaden Mar 20 '15 at 19:35
  • Here is the jsfiddle link - If I've done it correctly... https://jsfiddle.net/vduxbnkj/ – sbaden Mar 20 '15 at 19:45

4 Answers4

7

If you're running a simple for (..) loop, this cannot be stopped via external influence. Everything is happening on the same thread in Javascript, unless your code "ends" at some point and returns control to the browser for a while no UI interaction can happen. The easiest way to have a "loop" is via a setTimeout or setInterval:

interval = null;

startBTN.onclick = function () {
    var i = 0;
    interval = setInterval(function () {
        console.log(i++);  // this is inside your loop
    }, 1);
};

stopBTN.onclick = function () {
    clearInterval(interval);
};
deceze
  • 510,633
  • 85
  • 743
  • 889
1

Javascript is single threaded and as long it is in a loop, it can't give control to other code to stop it. But if you have a special kind of loop that is implemented with setTimeout:

function loopStep() {
    ...
}

function loop() {
     loopStep();
     setTimeout(loop, 0);
}

then you can add a flag to be able to stop loop's execution:

var flag = true;
function loop() {
    if (!flag) return;
    loopStep();
    setTimeout(loop, 0);
}

and then you can define your stop function:

function stop() {
    flag = false;
}
JuniorCompressor
  • 19,631
  • 4
  • 30
  • 57
0

I usually work around this by making my own boolean test as the while condition, like so:

var keepLooping = false;

while(!keepLooping){
    document.getElementById("loopButton").onclick = function(){
        keepLooping = true;
    }
}
while(keepLooping){
    //do something here
    document.getElementById("loopButton").onclick = function(){
        keepLooping = false;
    }
}
-1

The only method I can think of is to create a boolean at the very beginning, and set stopBTN.onclick as a function that switches the variable. Then put an if condition that uses break if the boolean is switched.

var r = false;
startBTN.onClick = function(){ runLoop(); }
stopBTN.onClick = function(){r = true; }

function runLoop(){
    while(condition true){
        getFolderContentsLoop();
        if(r){
            break;
        }
    }
}

function getFolderContentsLoop(){
    /*loop through folders & files looking for .txt file and if "finished"
      delete files and folders*/
}

It's crude, but it should work.

swapneils
  • 149
  • 10