In need of a Javascript Delay

Question

I was wondering how I could modify this code so that it has a 2 second delay before the function become active:

<script type="text/javascript">
function iframe_onload()
{
var theWaitCell = document.getElementById('Wait1');
theWaitCell.style.display = "none";
}
</script>

Any help would be appreciated,

Thanks!

Answer 1

function iframe_onload()
{
 var timer = setTimeout(function() {
 var theWaitCell = document.getElementById('Wait1');
 theWaitCell.style.display = "none";
 }, 2000);
}

Answer 2

You can use the setTimeout() function:

Syntax:

// Fires yourFunction() after delayInMilliseconds has elapsed
// Note: You pass the function object as the first parameter
// do NOT execute the function here (i.e. omit the "()")
setTimeout(yourFunction, delayInMilliseconds);

Usage:

<script type='text/javascript'>
//Timeout Function (2000 ~ 2 Seconds)
setTimeout(iframe_onload, 2000);
//Action Function
function iframe_onload() {
 var theWaitCell = document.getElementById('Wait1');
 theWaitCell.style.display = "none";
}
</script>

• Beez: Wouldn't "yourFunction()" and "iframe_onload()" execute immediately? I think you want "setTimeout(iframe_onload, 2000);"
• Rion Williams: That is correct - I believe the edit has been made :) Thanks to Beez and Ivo for the edit.

Answer 3

Use setTimeout.

<script type="text/javascript">
setTimeout(
 function ()
 {
 var theWaitCell = document.getElementById('Wait1');
 theWaitCell.style.display = "none";
 },
 2000 // The 2nd arg is delay in milliseconds
);
</script>

Reference: https://developer.mozilla.org/en/DOM/window.setTimeout

See also: https://developer.mozilla.org/en/DOM/window.clearTimeout

Answer 4

I think if you want a nice delay you should use jquery but you could also call the function in the input with setTimeout();

<form>
<input type ="button lets say" onclick = "setTimeout('iframe_onload()', 2000);"/>
</form>