Try with: clearTimeout() in else condition .

You need to create the setTimeout() in one variable.Then apply the clearTimout() if the condition is false(Its means a else statement)

var timer;
//call effect on load
$(function() {
    moveSlide(true);
});

//move the div
function moveSlide(repeat) {
    if(repeat === true) {
      console.log('running')
        $('#slide_show').slideToggle('slow',function() {
            timer = setTimeout(function() {
                moveSlide(true);
            },2000);
        });
    } else {
      clearTimeout(timer);
       console.log('stopped')
        return;
    }
}

//stop the function
$(document).on('click','.stop',function(e) {
   e.preventDefault();
   moveSlide(false);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<div id="slide_show"></div>
<a href="#" class="stop">Stop</a>

You might want to use setInterval() instead of setTimeout() to make it simpler.

To start the timer, make sure baseTime and endTime are initialized or have the valid values, then use below example code.

timerId = setInterval(yourFunction, 3);

When you need to pause the timer, use below code.

clearInterval(timerId);

Try

function findCategory(categoryName) {
    var trail = [];
    var found = false;

    function recurse(categoryAry) {

        for (var i = 0; i < categoryAry.length; i++) {
            trail.push(categoryAry[i].category);

            // Found the category!
            if ((categoryAry[i].category === categoryName)) {
                found = true;
                break;

                // Did not match...
            } else {
                // Are there children / sub-categories? YES
                if (categoryAry[i].children.length > 0) {
                    recurse(categoryAry[i].children);
                    if(found){
                        break;
                    }
                }
            }
            trail.pop();
        }
    }

    recurse(catalog);

    return trail
}

Demo: Fiddle

You can easily solve this with state. Simply add a variable to your code called

  var isRunning = false;

which it to true when you start the animation, and false to stop the animation. Then inside your iterator function, check to see if isRunning is false. If isRunning === false, you don't call the next setTimeout, hence stopping the animation.

A way to do what you want is to use a global variable in there and check it on each iteration. So at the start of your code you set a variable: ```javascript var stop = false; ``` Then you check if stop is false each time you animate: ```javascript function autoPlay() { var position = $("#inner-slider").position(); if (position.left <= outerLimit) { $("#inner-slider") .delay(1000) .animate({ left: '0px' }, function () { setFilled() if(stop === false){ autoPlay() } }); } else { $("#inner-slider") .delay(1000) .animate({ left: '-=' + imageWidth }, function () { setFilled() if(stop === false){ autoPlay() } }); } } ``` When a user clicks on a navigation button, we set stop to true: ```javascript //PREVIOUS $("#nav-prev").click(function () { stop = true; var position = $("#inner-slider").position(); if (position.left != 0) { $("#inner-slider").stop().animate({ left: '+=' + imageWidth }, function () { setFilled() }); } }); //NEXT $("#nav-next").click(function () { stop = true; var position = $("#inner-slider").position(); if (position.left <= outerLimit) { $("#inner-slider").stop().animate({ left: '0px' }, function () { setFilled() }); } else { $("#inner-slider").stop().animate({ left: '-=' + imageWidth }, function () { setFilled() }); } }); ```

Something like:

var needStop = false;

function create_abcd()
{
    var dataString = 'action=create_abcd&type=' + $('#abcd_type').val() + '&count=100';
    $.ajax({
        type: "POST",
        url: "backend.php",
        data: dataString,
        success: function(msg){
            if(needStop) {
                needStop = false;
                return;
            }
            if(msg != "0")
            {
                $("#abcd_output").append('<p>' + msg + '</p>')
                    setTimeout(create_abcd, 2000);
            }
            else
                return false;
        }
    });
}

$('#button').click(function() {
    needStop = true;
});

=)

Since you already have returns in the code I'm assuming you know that you can just return from the function at that point.

You could return with a value that means something somewhere else.

The functionality that you want is almost (or is) a goto.

So, since exceptions run very similarly to gotos you could implement the method something like the following by throwing an exception when the thing occurs.

function generateParseTree(parsingArray, left, right, rootIndex) {
   try
    {
        probability *= parsingArray[left][right][rootIndex].prob;
        if (!parsingArray[left][right][rootIndex]['divide']) {
            if (left == parsingArray.length - 2 && right == parsingArray.length - 1) {
                if (probability > 1e-6) {
                    suming ++;
                    throw "this thing is done";
                }
                return;
            } else {                    
                return;
            }
        }
        generateParseTree(parsingArray, left, parsingArray[left][right][rootIndex]['divide'], parsingArray[left][right][rootIndex]['right1Index']);
        generateParseTree(parsingArray, parsingArray[left][right][rootIndex]['divide'], right, parsingArray[left][right][rootIndex]['right2Index']);
        return;
      }
      catch (err)
      {
           console.log(err); // "this thing is done"
      }
    }

Your return only returns the element up one level in your recursive call - you need to make sure it gets returned all the way to the top.

You thus need to replace your line

LoopThroughChildElements(parantEle.childNodes[i]);

(which is currently discarding the returned element) with something like

var rtn = LoopThroughChildElements(parantEle.childNodes[i]);
if (rtn != null)
    return rtn;

Any additional context? I’m not really sure why a function to start timers would need to be recursive

Using recursion to implement a slideshow is probably not a good idea because it will eventually give a stack overflow.

Use timeouts instead.

setTimeout() - executes a code some time in the future

clearTimeout() - cancels the setTimeout()

Or intervals (thanks Ricket for pointing this out!):

The setInterval() method calls a function or evaluates an expression at specified intervals (in milliseconds).

The setInterval() method will continue calling the function until clearInterval() is called, or the window is closed.

Here this will stop the animate function after two seconds. I have marked the changes I made with the comment '//new change'. You can control the time in milliseconds the animation runs using the setTimeOut function. I have used 2 seconds for example. You can also set this using a random generator to get different time spans.

var animate = false; //new change

$(function () {
    $('.a').mouseenter(function() {
        animate = true;//new change
        animateDiv();
        setTimeout(function(){animate = false },2000)//new change
    });
});

function makeNewPosition() {      
   var h = $(window).height() - 50;
   var w = $(window).width() - 50;
   var nh = Math.floor(Math.random() * h);
   var nw = Math.floor(Math.random() * w);

   return [nh, nw];
}

function animateDiv() {
   var newq = makeNewPosition();
   console.log(newq);
    $('.a').animate( 
      {top: newq[0], 
       left: newq[1], }
      ,400, function () {
            if(animate) animateDiv();//new change
       });
    };

Here is a jsfiddle. Check the console log

Here is how this works. Before you begin animation in recursive function you set animation flag to true. The function calls itself only if this flag is true. Then you start a saperate timer which make animate flag false, which will cause the recursive function to break.

PS: The animation code in your original question doesn't work anyway. But i didn't try to debug it as your question was only about how to stop the function after a while.