Execute Script After Specific Delay Using JavaScript

Execute script after specific delay using JavaScript

There is the following:

setTimeout(function, milliseconds);

function which can be passed the time after which the function will be executed.

See: Window setTimeout() Method.

Javascript: Call a function after specific time period

You can use JavaScript Timing Events to call function after certain interval of time:

This shows the alert box every 3 seconds:

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

You can use two method of time event in javascript.i.e.

  1. setInterval(): executes a function, over and over again, at
    specified time intervals
  2. setTimeout() : executes a function, once, after waiting a
    specified number of milliseconds

Execute JS function after some time of page load

Use setTimeout instead, as it is called only once after the pause:

setTimeout(myFunc, 3000);

How to delay execution in between the following in my javascript

You can use setTimeout for that:

setTimeout(function() {
// Your code here
}, delayInMilliseconds);

E.g.:

$("#myName").val("Tom");

/// wait 3 seconds
setTimeout(function() {
$("#YourName").val("Jerry");

/// wait 3 seconds
setTimeout(function() {
$("#hisName").val("Kids");
}, 3000);
}, 3000);

setTimeout schedules a function to be run (once) after an interval. The code calling it continues, and at some point in the future (after roughly the time you specify, though not precisely) the function is called by the browser.

So suppose you had a function called output that appended text to the page. The output of this:

foo();
function foo() {
var counter = 0;

output("A: " + counter);
++counter;
setTimeout(function() {
output("B: " + counter);
++counter;
setTimeout(function() {
output("C: " + counter);
++counter;
}, 1000);
}, 1000);
output("D: " + counter);
++counter;
}

...is (after a couple of seconds):

A: 0
D: 1
B: 2
C: 3

Note the second line of that. The rest of foo's code runs before either of the scheduled functions, and so we see the D line before the B line.

setTimeout returns a handle (which is a non-zero number) you could use to cancel the callback before it happens:

var handle = setTimeout(myFunction, 5000);
// Do this before it runs, and it'll never run
clearTimeout(handle);

There's also the related setInterval / clearInterval which does the same thing, but repeatedly at the interval you specify (until you stop it).

Delay function execution if it has been called recently

The question

Like a debouncer, you don't want to immediately execute on each call. But unlike a debouncer, you want to have each call queued for future execution.

Like a scheduler, you want to specify when to call the queued calls. More specifically, you want to execute calls with a fixed delay inbetween each call.

This means we can take inspiration from different ideas:

  • From debouncers: How to not execute on every call.
  • From queues: How to organize calls (first-in-first-out (FIFO) is what we want).
  • From schedulers: How to manage calls.

With async/await

Using async/await is a great idea! Note that in JS there is no way to sleep() natively because of its original synchronous design. We could either implement sleep() synchronously by spinning (highly discouraged because it will make your site unresponsive) or asynchronously with Promises.

Example of how a sleep() function can be implemented asynchronously:

function sleep(milli) {
return new Promise(resolve => setTimeout(resolve, milli));
}

Now, to refactor your code to use async/await, we mostly only need to inline the setTimeout() function. Simply put, until the setTimeout() call we can do as usual, then sleep() for the specified time (1000 milliseconds), and then inline the callback:

function sleep(milli) {
return new Promise(resolve => setTimeout(resolve, milli));
}
let available = true;
let requested = 0;
async function notTwiceASecond() {
if (available) {
available = false;

console.log("Executed");
// ...

await sleep(1000);
available = true;
if (requested) {
--requested;
notTwiceASecond();
}
} else {
++requested;
}
}

for (let i = 0; i < 3; ++i) {
console.log("called");
notTwiceASecond();
}

JavaScript - Delay execution of certain javascript

Looking at your code, I think you should just remove the line

show_next_live_notify();

at the bottom of your script. It automatically executes everything right upon start instead of letting setInterval do its job

To delay the whole script, replace the last two lines in the jQuery call with something like this:

function startMe() {
interval = setInterval(show_next_live_notify, (showtime + <?php print $s + 100; ?>));
}

setTimeout(startMe, 10000);


Related Topics



Leave a reply



Submit