javascript timed loop w/setTimeout not working

Question

I'm trying to write a script to update an iframe every second. This is what I have so far, and for some reason it loads for a little while and then displays the number 14541 +/- 50 or so. The words "something" and "something else" also never appear on the screen.

Is it stopping at 14541 because of some built-in browser safeguard against infinite loops or something? Why is the timer not working correctly?

var c = 0;
var t;
timer();
document.write("something");
function timer(){
    if(t) { window.clearTimeout(t) }
    update_preview();
    c++;
    t=setTimeout(timer(), 1000);
    document.write("something else");
}
function update_preview(){
    prev = window.open("","preview");
    prev.document.open();
    prev.document.writeln("<html><head><title>live preview window</title></head><body>");
    prev.document.writeln(c);
    prev.document.writeln("</body></html>");
    prev.document.close();
}

Shiplu Mokaddim · Accepted Answer · 2012-02-24 19:40:09Z

1

Use this,

t=setTimeout(function(){timer();}, 1000);

or

t=setTimeout(timer, 1000);

or

t=setTimeout("timer()", 1000);

The last one is an option that should not be used.

answered Feb 24, 2012 at 19:40

Shiplu Mokaddim

57.5k20 gold badges147 silver badges193 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

jhruby · Accepted Answer · 2012-02-24 19:37:40Z

0

You can't call method timer as a parameter of function timer. You have to pass as parameter function timer:

setTimeout(timer,1000);

Dont use document.write is obsolete. Look at DOM and jQuery in order to manipulate with the page dynamically.

answered Feb 24, 2012 at 19:37

jhruby

2682 silver badges6 bronze badges

1 Comment

mavix Over a year ago

Can you elaborate on this? I fixed the timer and now somehow it works at 0, and then redirects to a new page where it prints "something else" over and over, and a popup comes up that displays the increasing number.

Niet the Dark Absol · Accepted Answer · 2012-02-24 19:36:19Z

0

Remove the () after timer.

By putting timer(), you are calling the timer function immediately and assigning the return value (undefined, since you don't return anything in that function) to be the function executed when the timer runs out.

Instead, you should just put timer. This passes the function itself, rather than its return value, to be the function called when the timer runs out.

Also, for clarity, I would suggest putting the function timer() {...} bit before the initial call to timer(). JavaScript does this for you automatically (called "hoisting"), but it's easier to understand if you put the function definition first yourself.

answered Feb 24, 2012 at 19:36

Niet the Dark Absol

326k86 gold badges480 silver badges604 bronze badges

Comments

seth.miller · Accepted Answer · 2012-02-24 19:36:52Z

0

On this line t=setTimeout(timer(), 1000); you are not passing timer to setTimout, you are passing the result of timer. You should use t=setTimeout(timer, 1000); instead.

answered Feb 24, 2012 at 19:36

seth.miller

1,98617 silver badges23 bronze badges

Comments

Mike · Accepted Answer · 2012-02-24 20:15:44Z

0

It would be better to use setInterval instead of setTimeout.

answered Feb 24, 2012 at 20:15

Mike

3581 gold badge3 silver badges12 bronze badges

Comments

Francis Lewis · Accepted Answer · 2012-02-25 00:19:00Z

The reason "something else" is not displaying is because when you're calling setTimeout and passing the function in, the timer function is processing immediately. The same thing is happening inside the function. So you're creating a non-terminating infinite recursive loop that will make your browser unresponsive.

Since you're running setTimeout on timer every time you run the timer function, which is every 1 second, instead of using setTimeout, you should use setInterval.

So your code would look like this:

var c = 0;
var t;
timer();

// call setInterval here to run the timer function every 1 second
t=setInterval('timer()', 1000);

document.write("something");
function timer(){
    if(t) { window.clearTimeout(t) }
    update_preview();
    c++;
    document.write("something else");
}
function update_preview(){
    prev = window.open("","preview");
    prev.document.open();
    prev.document.writeln("<html><head><title>live preview window</title></head><body>");
    prev.document.writeln(c);
    prev.document.writeln("</body></html>");
    prev.document.close();
}

So now instead of running setTimeout every 1 second, you're running setInterval once and it will process every 1 second.

Collectives™ on Stack Overflow

javascript timed loop w/setTimeout not working

6 Answers 6

Comments

1 Comment

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

6 Answers 6

Comments

1 Comment

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related