How to break out of jQuery each loop?

Viewed 670204

How do I break out of a jQuery each loop?

I have tried:

 return false;

in the loop but this did not work. Any ideas?


Update 9/5/2020

I put the return false; in the wrong place. When I put it inside the loop everything worked.

7 Answers

I created a Fiddle for the answer to this question because the accepted answer is incorrect plus this is the first StackOverflow thread returned from Google regarding this question.

To break out of a $.each you must use return false;

Here is a Fiddle proving it:

http://jsfiddle.net/9XqRy/

I know its quite an old question but I didn't see any answer, which clarify that why and when its possible to break with return.

I would like to explain it with 2 simple examples:

1. Example: In this case, we have a simple iteration and we want to break with return true, if we can find the three.

function canFindThree() {
    for(var i = 0; i < 5; i++) {
        if(i === 3) {
           return true;
        }
    }
}

if we call this function, it will simply return the true.

2. Example In this case, we want to iterate with jquery's each function, which takes anonymous function as parameter.

function canFindThree() {

    var result = false;

    $.each([1, 2, 3, 4, 5], function(key, value) { 
        if(value === 3) {
            result = true;
            return false; //This will only exit the anonymous function and stop the iteration immediatelly.
        }
    });

    return result; //This will exit the function with return true;
}

I use this way (for example):

$(document).on('click', '#save', function () {
    var cont = true;
    $('.field').each(function () {
        if ($(this).val() === '') {
            alert('Please fill out all fields');
            cont = false;
            return false;
        }
    });
    if (cont === false) {
        return false;
    }
    /* commands block */
});

if cont isn't false runs commands block

Related