28

I have a javascript file, and in several places I want to add a small delay, so the script would reach that point, wait 3 seconds, and then continue with the rest of the code. The best way that I thought of doing this was to create a function, which I could call from anywhere in the script.

function startDelay(lengthOfDelay)
{
//code to make it delay for lengthOfDelay amount of time
}

However, I can not find any way to implement the code to make it wait. I had a look at setTimeout, but you needed to hard code the function into it, which made it no good for me.

Is there any way that I can get the script to juct pause for a few seconds? I have no problem with the UI freezing whilst the code is paused.

If not, is there a way that I could use the PHP sleep() to achieve this? (I know that PHP is server side and Javascript is client side, but maybe there is a way that I have not heard of.)

3
  • 2
    The simplest way is to use setTimeout and to do the remaining of your code in the function you give to setTimeout. Commented Jun 1, 2013 at 14:49
  • 1
    stackoverflow.com/questions/10312963/javascript-settimeout Commented Jun 1, 2013 at 14:50
  • just create a promise that return a settimeout, and use it in a async function to use the await: const delay =async(seconds)=>new Promise( resolve=>setTimeout(resolve,seconds)); /////// Commented Jun 10, 2023 at 19:43

3 Answers 3

70

You do not need to use an anonymous function with setTimeout. You can do something like this:

setTimeout(doSomething, 3000);

function doSomething() {
   //do whatever you want here
}
Sign up to request clarification or add additional context in comments.

4 Comments

How would I create a function such as startDelay(lengthOfDelay) that I could call from anywhere in the script and have it do the rest of the code afterwards, not just //do whatever you want here?
I'm not really sure what you want to do exactly. Do you want to halt the execution of the page or schedule a function that will execute after a delay?
@Kassem I think (s)he means e.g. what if you want to console.log a message every second using a for loop? i.e. while(true){ [a delay function, incorporating console.log]} I don't think your function will run sequentially.
Didn't work for me the first time, but the following solved my problem: setTimeout(function() { doSomething(); }, 3000);
5

Ah yes. Welcome to Asynchronous execution.

Basically, pausing a script would cause the browser and page to become unresponsive for 3 seconds. This is horrible for web apps, and so isn't supported.

Instead, you have to think "event-based". Use setTimeout to call a function after a certain amount of time, which will continue to run the JavaScript on the page during that time.

2 Comments

Is there any way to do this? Making the page unresponsive is actually a positive thing for me!
fortunatelly yes: sleep.js stackoverflow.com/a/16873849/667927
-3

You can create a delay using the following example

setInterval(function(){alert("Hello")},3000);

Replace 3000 with # of milliseconds

You can place the content of what you want executed inside the function.

5 Comments

This answer is slightly lacking (I think) because setInterval will continue to run every 3 seconds, not just once.
@AdamDavis I've tested this method and I haven't experienced any problems. Should you or someone else test this and demonstrate otherwise let the community know. Thanks
@CBC_NS I just tried it out and I also had it repeating every 3 seconds. Handy to keep in mind though.
This answer is wrong. The original post states, "I want to add a small delay, so the script would reach that point, wait 3 seconds, and then continue with the rest of the code." This code will continually call the declared function every n milliseconds until a clearInterval is set. This could have very bad unintended consequences.
just replace setInterval with setTimeout and it works as intended

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.