Timer funcitons in JavaScript: Reminder Script

Timers are used in web pages and we will discuss how to setup one and how to use one with an example. The function setTimeout() in function is used and here is its general syntax.

mytime = setTimeout(expression, msec);

mytime is the identifier used to identify the current timeout function. 

expression is the statement that is to be executed after the specified time has ticked off. 

msec is the duration of time in milliseconds after which the expression will be executed. 


You can see by using setTimeout function we can execute any function or object after a set of time. For example if msec is set 5000 then the expression will be executed after 5 seconds or 5000 milliseconds. 

We will try one example where we will have four period buttons and each button will set a different time for another function to execute and display a alert button. We will call it as a reminder script and we will get one alert box based on the period button we clicked. Note that we will be using onclick event of period button for this. Here is the demo and you will get alert message box based on the radio button you clicked. 

No reminder After 2 Secs After 5 Secs After 10 Secs 

Now here is the code to be used inside your head tags

<script type="text/javascript"> 
function remind(msg1) { 
var msg = "This is a reminder after " + msg1 +" Secs";
alert(msg); 
}
</script>

This is the code we used for displaying the period buttons

<input type=radio name=rm value=no checked>No reminder
<input type=radio name=rm value=5000 OnClick="mytime=setTimeout('remind(2)',2000)">After 2 Secs
<input type=radio name=rm value=5000 OnClick="mytime=setTimeout('remind(5)',5000)">After 5 Secs
<input type=radio name=rm value=5000 OnClick="mytime=setTimeout('remind(10)',10000)">After 10 Secs