JavaScript:Tutorial, Digital Clock

**TcM** · 12-02-2006, 06:22 AM

Introduction:-
This is my second tutorial and I will show you how to get the Time in a Text Box.. perhaps in a Text Box it will be useless, but it could be used in other instances!

Solution:-
This code goes in the <head> tags:-

Code:

<script language="JavaScript">

var timerID = null;
var timerRunning = false;

function stopclock (){
        if(timerRunning)
                clearTimeout(timerID);
        timerRunning = false;
}

function showtime () {
        var now = new Date();
        var hours = now.getHours();
        var minutes = now.getMinutes();
        var seconds = now.getSeconds()
        var timeValue = hours
        timeValue += ((minutes < 10) ? ":0" : ":") + minutes
        timeValue += ((seconds < 10) ? ":0" : ":") + seconds
        document.clock.face.value = timeValue;
        timerID = setTimeout("showtime()",1000);
        timerRunning = true;
}
function startclock () {
        stopclock();
        showtime();
}

</script>

And this code as the body code:-

Code:

<body onLoad="startclock()">

<form name="clock" onSubmit="0">
  <div align="center"><center><p><input type="text" name="face" size="10" value> </p>
  </center></div>
</form>

Explanation:-
I think its simple without any need of explanation.. but if you have any suggestions/questions just post them here

A Preview:-

Conclusion:-
As Always Feedback is welcome and the full source is attached!!