[Okta Webinar] Learn how to a build a cloud-first strategyRegister Now

x
?
Solved

setInterval() and setTimeout don't work with document.write

Posted on 2014-08-02
8
Medium Priority
?
555 Views
Last Modified: 2014-08-03
Is there a way to make setInterval() and setTimeout() call document.write repeatedly? It seems like document.write isn't supported by setInverval and setTimeout.

For example, these scripts don't work:

function loopFun() {
  document.write("Here we go again...<br/>");
   setTimeout("loopFun()", 5000);
   }
loopFun();

function loopFun() {
  document.write("Here we go again...<br/>");
     setInterval("loopFun()", 5000);
}
loopFun();

But if you replace document.write() with alert(), the scripts work:

function loopFun(){
alert("Here we go again");
setTimeout("loopFun()", 5000);
}
loopFun();

function loopFun(){
alert("Here we go again");
setInterval("loopFun()", 5000);
}
loopFun();
0
Comment
Question by:MBarongan
8 Comments
 
LVL 84

Expert Comment

by:Dave Baldwin
ID: 40237054
This page from W3Schools shows different ways to use those functions: http://www.w3schools.com/js/js_timing.asp
0
 

Author Comment

by:MBarongan
ID: 40237059
I looked through all the examples from http://www.w3schools.com/js/js_timing.asp, but I don't see document.write in any of them (unless I overlooked it). Does that mean document.write can't be used with setInterval and setTimeout?
0
 
LVL 84

Expert Comment

by:Dave Baldwin
ID: 40237165
I didn't have any problem getting 'document.write' to work twice... but the timing loop failed after the second time.  Note that the function with 'document.write' must be in the body of the page.  'alert' will work in the <head> section but 'document.write' will not.

Try the examples on that page and see if they work for you as they are.  Note that setTimeout is shown as working once while setInterval is shown as being repetitive.  I suspect that your 'setInterval' isn't going to work right because you're setting a repetitive interval over and over again without ever shutting any of the intervals down.
0
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
LVL 111

Expert Comment

by:Ray Paseur
ID: 40237308
In layman's terms, what do you want to make happen?  document.write() is kind of "hamfisted."  Have you tried putting the interval timers outside of the function definition?
0
 
LVL 83

Accepted Solution

by:
leakim971 earned 1000 total points
ID: 40237395
put a div (or maybe a <p></p>...) in the page where you want to see it write.

<div id="writeHere"></div>

and use the following code :
Test page : http://jsfiddle.net/m54hg/1/

function loopFun() {
  var container = document.getElementById("writeHere");
  var currentContent = container.innerHTML;
  var newContent = currentContent + "Here we go again...<br/>";
  container.innerHTML = newContent;
  setTimeout("loopFun()", 5000);
}

Open in new window

0
 
LVL 58

Assisted Solution

by:Gary
Gary earned 500 total points
ID: 40237408
You don't use document.write like that - it is supposed to be used as you build the page.

Doing it as you are doing it will clear everything on the page on the second loop
Does that mean document.write can't be used with setInterval and setTimeout?
Correct - that's not how document.write works

edit
I suppose you could document.write your two functions again but why would you do it that way...???
0
 
LVL 84

Assisted Solution

by:Dave Baldwin
Dave Baldwin earned 500 total points
ID: 40237752
Doing it as you are doing it will clear everything on the page on the second loop
That's exactly what I saw happening.  Which would also explain why it stopped after the second loop.
0
 

Author Closing Comment

by:MBarongan
ID: 40238102
Using the <div> tag made it work right. Thank you for clarifying the correct usage of document.write().
0

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Originally, this post was published on Monitis Blog, you can check it here . It goes without saying that technology has transformed society and the very nature of how we live, work, and communicate in ways that would’ve been incomprehensible 5 ye…
Ready to get certified? Check out some courses that help you prepare for third-party exams.
The viewer will learn how to count occurrences of each item in an array.
The viewer will get a basic understanding of what section 508 compliance can entail, learn about skip navigation links, alt text, transcripts, and font size controls.
Suggested Courses
Course of the Month19 days, 2 hours left to enroll

834 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question