Javascript timeout usage - Complete timeout demo code

Home - Tutorials - Date and time

In this tutorial I will show you how to use timeouts in your JavaScript code. With this information you will be able to create a usefull timer.

Tutorial info:

Name:	Javascript timeout usage
Total steps:	3
Category:	Date and time
Date:	2008-01-25
Level:	Beginner
Product:	See complete product
Viewed:	60065

Bookmark Javascript timeout usage

Step 3 - Complete timeout demo code

Javascript timeout usage

Code: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
   <title>Javascript timeout tutorial</title>
 
<script language="javascript" type="text/javascript">
<!--
var myTimer;
 
function endTime(){
   clearTimeout(myTimer);
}
 
function showTime(){
   myDate = new Date();
 
   // Get time parts
   hours   = myDate.getHours();
   minutes = myDate.getMinutes();
   seconds = myDate.getSeconds();
 
   // Just to display the time in a nice format
   if (hours < 10)   hours   = "0" + hours;
   if (minutes < 10) minutes = "0" + minutes;
   if (seconds < 10) seconds = "0" + seconds;
 
   actualTime = hours+":"+minutes+":"+seconds;
 
   // Change the block content
   document.getElementById("actTime").innerHTML = actualTime;
   myTimer = setTimeout("showTime()",1000);
}
 
//-->
</script>
 
</head>
 
<body>
   <p>The actual time is:<span id="actTime"></span></p>
   <button onclick="showTime();">Start clock</button>
   <button onclick="endTime();">Stop clock</button>
</body>
</html>
Javascript F1

Previous Step of Javascript timeout usage

Tags: javascript timeout, timeout script, javascript, timeout

Javascript timeout usage - Table of contents
Step 1 - Using timeouts in JavaScript
Step 2 - Displaying the current time
Step 3 - Complete timeout demo code

JavaScript F1

Help in JavaScript, get JavaScript code, scripts, tutorials

Javascript timeout usage - Complete timeout demo code

Tutorial info:

Bookmark Javascript timeout usage

Step 3 - Complete timeout demo code