Elapsed Time Calculator

David Tam Apr 22, 2003

This script computes and displays the elapsed time between "Start" and "Finish" button clicks.

The JavaScript Source: Math Related: Elapsed Time Calculator

Simply click inside the window below, use your cursor to highlight the script, and copy (type Control-c or Apple-c) the script into a new file in your text editor (such as Note Pad or Simple Text) and save (Control-s or Command-s). The script is yours!!!

<!-- TWO STEPS TO INSTALL ELAPSED TIME CALCULATOR:

1.  Copy the coding into the HEAD of your HTML document
  2.  Add the last code into the BODY of your HTML document  -->

<HEAD>

<script language="Javascript">
<!-- Gracefully hide from old browsers
// Copyright © 2003 by David Tam, Ph.D.  http://www.ComputationalNeuralSystems.com/
//   You may copy, modify and/or distribute it under the terms of the GNU General Public License.
//   See http://www.gnu.org/licenses/gpl.html for terms and conditions

// Javascript to compute elapsed time between "Start" and "Finish" button clicks
function timestamp_class(this_current_time, this_start_time, this_end_time, this_time_difference) { 
		this.this_current_time = this_current_time;
		this.this_start_time = this_start_time;
		this.this_end_time = this_end_time;
		this.this_time_difference = this_time_difference;
		this.GetCurrentTime = GetCurrentTime;
		this.StartTiming = StartTiming;
		this.EndTiming = EndTiming;
	}

//Get current time from date timestamp
	function GetCurrentTime() {
	var my_current_timestamp;
		my_current_timestamp = new Date();		//stamp current date & time
		return my_current_timestamp.getTime();
		}

//Stamp current time as start time and reset display textbox
	function StartTiming() {
		this.this_start_time = GetCurrentTime();	//stamp current time
		document.TimeDisplayForm.TimeDisplayBox.value = 0;	//init textbox display to zero
		}

//Stamp current time as stop time, compute elapsed time difference and display in textbox
	function EndTiming() {
		this.this_end_time = GetCurrentTime();		//stamp current time
		this.this_time_difference = (this.this_end_time - this.this_start_time) / 1000;	//compute elapsed time
		document.TimeDisplayForm.TimeDisplayBox.value = this.this_time_difference;	//set elapsed time in display box
		}

var time_object = new timestamp_class(0, 0, 0, 0);	//create new time object and initialize it

//-->
</script>
</HEAD>

<BODY>

<form>
  		<input type="button" value="Start" onClick="time_object.StartTiming()"; name="StartButton">
  </form>
  <form>
  		<input type="button" value="Finish" onClick="time_object.EndTiming()"; name="EndButton">
  </form>
  <form name="TimeDisplayForm">
  Elapsed time:
  <input type="text" name="TimeDisplayBox" size="6">
  seconds
  </form>

<p><center>
<font face="arial, helvetica" size"-2">Free JavaScripts provided<br>
by <a href="http://javascriptsource.com">The JavaScript Source</a></font>
</center><p>

Did you use this script? Do you like this site? Please link to us!

Leave a Response

(0 comments)

Alphabetical Listing

Tutorials

Ajax Tutorials

Ajax

Buttons

Cookies

CSS

Forms

Games

Generators

Image Effects

Math Related

Miscellaneous

Multimedia

Navigation

Page Details

Password

Snippets

Text Effects

Time & Date

User Details

Elapsed Time Calculator

Leave a Response

Attention JavaScript Coders

Go Deeper