how to make a sleep in javascript?

Question

Does anyone know how can I make a sleep in javascript before next line been read by the system?

example:

 1 var chkResult = Validation();
 2 //sleep here for for 10 sec before the next line been read  
 3 
 4 document.getElementById('abc').innerHTML = chkResult;

For this example, how can I make the javascript sleep/wait in line 2 for 10 sec before it continues to read line 4? I had tried setTimeout('', 10000); but it's seems not working for me still...

Answer 1

Try

setTimeout(function() { return true; }, 10000);

The first argument expects a function. This is from memory; I haven't tested it.

Edit: What Gumbo said... late here... not sure what I was thinking.

Answer 2

setTimeout starts a separate execution "thread" within the JavaScript interpreter. You need to pass it a function and design your scripts in such a way that the function the setTimeout runs will continue where the calling function left off--thereby simulating a sleep.

Answer 3

The delay won't happen until JavaScript has relinquished control back to the browser, so your line 4 will execute before the setTimeout starts.

You should be making everything happen based on events.

Answer 4

I Have the Hat has given the right hint. Use the setTimeout method to execute your forth line code after 10 seconds:

var chkResult = Validation();
var timeout = window.setTimeout(function() {
    document.getElementById('abc').innerHTML = chkResult;
}, 10000);

Storing the timeout ID in a variable can be handy if you want to clear a timeout.

Answer 5

May I suggest this as a generic solution:

  function sleep (ms, args, obj) {
    /* Called at the top of a function to invoke a delay in processing that
       function

       Returns true if the function should be executed, and false if the sleep
       timer is activated. 

       At the end of the sleep tiemout, the calling function is re-called by
       calling it with "apply (obj, args || [])".
    */

    var caller = sleep.caller;
    if (caller.sleepTimer) { 
      /* if invoked from timeout function, delete timer and return false */
      delete caller.sleepTimer;
      return true;
    }

    /* Create timer and re-call caller at expiry */
    caller.sleepTimer = window.setTimeout (function () {
      caller.apply (obj || null, args || []);
    },ms);

    return false;
  }

Examples of use:

function delayed () {
  if (!sleep (5000)) return;  

  document.body.innerHTML += "<p>delayed processing</p>";
}

function delayed_args (a, b) {
  if (!sleep (10000, arguments)) return;  

  document.body.innerHTML += "<p>args : (" + a + ", " + b + ")</p>";
}

function delayed_method_args (a,b) {
  if (!sleep (20000, arguments, this)) return;  

  document.body.innerHTML += "<p>method_args " + this + " (" + a + ", " + b + ")</p>";
}

Tested on Opera and Firefox 3.0

Answer 6

    1 var chkResult = Validation();
    2 alert("wait ten seconds, then press ok");
    3       
    4 document.getElementById('abc').innerHTML = chkResult;

The preceeding code delegates the sleep task to a parallel processor. This is a little messy because you have to use a DSL for this style of threading.

Answer 7

Javascript has to share the thread with the browser, so the kind of pause you want would look very much like the browser was frozen for 10 seconds, were it possible. Functions such as "alert" and "prompt" do this. For this, they are evil, as a single alert in a loop can bring a whole browser to its knees, and the only way out is to force quit it.

The way around this problem is the event based paradigm. Javascript has first class functions, so they can be passed around as values for "callbacks" that you can assign to certain events.

setTimeout is one such event. Others have posted code, but in general, you'll want to just assign your functions to certain events, then get out of the way of the browser, so it can go about its browsery business. The browser will let you know when something has happened, and you can do something appropriate in response, quickly, then get out of the way again. In this way, the browser can maintain the appearance of being responsive.

if you want to know more, have a look at this question: http://stackoverflow.com/questions/379231/how-is-gui-and-game-program-flow-compared-to-web-programs

Answer 8

but this way, your line line will execute BEFORE line 4