Easy Java Script Timer Code
By Stephen Bucaro
Sometimes you need something to happen after a delay, or you need something to
occur repeatedly. This can be accomplished using Java Script timers. To create
a single delay you would use the setTimeout method. You could then cancel
the timeout with the clearTimeout method. To create a repeating event, you
would use the setInterval method. You could then cancel the timer with
the clearInterval method.
Single Call
timerID = setTimeout(functionName(),milliseconds)
clearTimeout(timerID)
Repeating Calls
timerID = setInterval(functionName(),milliseconds)
clearInterval(timerID)
My objective in this article is to give you the timer code without surrounding
it with a lot of confusing peripheral code so you can quickly use it for your
own purposes. For that reason, Ill give you examples of functions that use a timer
first. Examples of how to call those functions second. And I'll show you the
example function called by the timers last. Lets do a repeating event call first.
<script type="text/javascript">
var timerID;
function startTimer()
{
timerID = window.setInterval("reverseText()", 2000);
}
</script>
Shown above is a Java Script code block containing a variable to hold the timmer's
ID and a function named startTimer that executes the setInterval
method, passing it the name of a function to call, reverseText(), after
the time interval of 2000 milliseconds (2 seconds). The startTimer function
returns the timer's ID which is saved in the variable timerID.
Whatever the reverseText() function does will be repeated every 2000
milliseconds until the clearInterval method is called. Below, I've added
a function named stopTimer which calls the clearInterval method,
passing it the timerID returned by the setInterval method.
<script type="text/javascript">
var timerID;
function startTimer()
{
timerID = window.setInterval("reverseText()", 2000);
}
function stopTimer()
{
window.clearInterval(timerID);
}
</script>
|