Question

so im a little new to javascript, but im trying to make a progress bar, with some other functionalities, on click of a button. im tring to use the set interval in javascript in order to time the bar, this is my js so far:

//Javascript Document

function progress(){
 Var uno = setTimeout("uno()", 3000);
  uno(){
   document.getElementById("title").innerHTML = "Connecting...";
   document.getElementById("progressInner").style.display = 'block';
   document.getElementById("progressInner").style.width = '20px';
  }   
}

From what i have gathered this is how it works, however i am skeptical as it seems i am setting a variable uno but not doing anything with it…. from my background in php, thats not how that works :p any pointers you guys can give me on this? my html is here: http://jsbin.com/apoboh/1/edit

right now, it does nothing, it gives me : Uncaught ReferenceError: progress is not defined

Answer 1

first, you are using setTimeout not setInterval. The former fires the callback once, the latter indefinitely at a set interval.

Second, these methods return a token that you can use to cancel a setInterval, do this instead

function startProgress(){
     // only start progress if it isn't running
     if (!App.progressToken) {  // App is you apps namespace
         App.progressToken = setInterval(function(){
             document.getElementById("title").innerHTML = "Connecting...";
             document.getElementById("progressInner").style.display = 'block';
             document.getElementById("progressInner").style.width = '20px';
         }, 3000);         
    }
}

later, when you want to stop:

function stopProgress(){
   clearInterval(App.progressToken);`
   delete App.progressToken
}