Binding for loop iterator values to callback functions in Javascript?

Question

How do I set the values to the callback function, so that it's saved and ready to fire when the element is clicked?

for (i=0; i < ELEMENTS-1; i++) {
    array[i].click(function(){
        array[i].insertAfter(array[i+1]); 
        //other stuff
    });
}

array[] just contains a bunch of divs.

    <div class="wrapper">
        <div id="one" class="tile">One</div>
        <div id="two" class="tile">Two</div>
        <div id="three" class="tile">Three</div>
        <div id="four" class="tile">Four</div>
    </div>

When a div is clicked, I want it to move down the list.

@dystroy - While it is one of the most commonly asked questions here -- if you've never run into it before you have no idea what to even LOOK for when trying to solve it. You have to admit, it is pretty non-obvious first time you run into it. — Jeremy J Starcher, Apr 17 '14 at 12:56
@JeremyJStarcher Yes. No need for downvotes (or not too much). But now we should close it properly. — Denys Séguret, Apr 17 '14 at 12:57
[Here's another similar QA with other explanations](http://stackoverflow.com/questions/14791158/javascript-settimeout-and-loops). — Denys Séguret, Apr 17 '14 at 12:59
@dystroy Both those answers implement a `setTimeout` function - why is this necessary? — tgun926, Apr 17 '14 at 13:08

score 0 · Answer 1 · answered Apr 17 '14 at 12:56

0

With jQuery, you can use:

$('.wrapper div').click(function() {
    $(this).insertAfter($(this).next());    
});

Fiddle Demo

answered Apr 17 '14 at 12:56

Felix

37,892
8
43
55

1

This won't help OP learn how to solve this general class of problem – Denys Séguret Apr 17 '14 at 12:57
@dystroy Since you already post comments related to his problem, do I need to post it again in my answer? – Felix Apr 17 '14 at 12:58
1

note : I'm not the downvoter. If it works I don't see any good reason to downvote – Denys Séguret Apr 17 '14 at 13:05

Binding for loop iterator values to callback functions in Javascript?

1 Answers1