CODEWITHSUNDEEP
javascriptsettimeout
sween5ter
sween5ter

Reputation: 33

Update DIV and empty it again 1 second later using setTimeout

I'm having a few issues with the script below.

To explain the background, the full script gets data from a JSON feed and if it has been updated since the last check it changes a marker on a map and adds a line to an array called updata[], which is straightforward enough.

Once the JSON refresh is complete I then want to display a notification of each refreshed item inside a small notifiation div at the bottom of the screen for 1 second before disappearing. The process should repeat until updata[] is empty.

Any ideas what I'm doing wrong?

<script type='text/javascript'>

//updata[] is populated by JSON in the full version, but for now...
var updata=["Site A Updated at 00:20"," Site B Updated at 00:22"," Site C Updated at 00:24"];

var val=0;
var max=updata.length+1;

function addtodiv()
{
   document.getElementById('alarms').innerHTML = '<span>'+window.val+':'+window.updata[window.val]+'</span>'
   setTimeout(cleardiv(), 1000); // refresh in 1 secs
} 

function cleardiv()
{
    window.val++;
   document.getElementById('alarms').innerHTML = '<span>&nbsp;</span>'
   if (window.val==window.max)
   {
     window.val=0;
     window.updata=[];
   } else {
   setTimeout(addtodiv(), 200); // refresh in 0.2 secs
  }
}

addtodiv();
</script>

Upvotes: 2

Views: 74

Answers (1)

dfsq
dfsq

Reputation: 193291

setTimeout accepts function reference as the first argument. So change your code:

setTimeout(cleardiv(), 1000);

to this:

setTimeout(cleardiv, 1000);
...
setTimeout(addtodiv, 200);

You don't want to invoke functions immediately cleardiv(), you just need to provide a reference.

Upvotes: 1

Related Questions