Question

I want to pass id1, id2 and id3 through the function below. This works just fine:

function doSomething(id1,id2,id3) {
    $(id1).fadeIn('slow',.25);
    $(id1).fadeIn('slow',.25);
    $(id1).fadeIn('slow',.25);
};

But this does not work:

function doSomething(id1,id2,id3) {
    setTimeout( " $(id1).fadeIn('slow',.25) ", 300);
    setTimeout( " $(id1).fadeIn('slow',.25) ", 300);
    setTimeout( " $(id1).fadeIn('slow',.25) ", 300);
};

How do I get the second one to work? My thought is I need some punctuation around the id’s. Or perhaps I can set a variable for the function within the setTimeout brackets. Any ideas?

Answer 1

It’s bad practice to get setTimeout() to evaluate a string. Instead, use an anonymous function:

function doSomething(id1, id2, id3) {
    setTimeout(function() {
        $(id1).fadeIn('slow', 0.25);
        $(id2).fadeIn('slow', 0.25);
        $(id1).fadeIn('slow', 0.25);
    }, 300);
};

Note that I’ve put all your fadeIn()s into one setTimeout(); it does the same thing as all your timeouts will trigger at the same time (300ms). If you IDs are strings, you could do this too:

function doSomething(id1, id2, id3) {
    setTimeout(function() {
        $(id1 + ', ' + id2 + ', ' + id3).fadeIn('slow', 0.25);
    }, 300);
};

Although it’s a little messy, but $.add() might do the trick.