JavaScript - Javascript Real-time Countdown (count From Start To End Time)

Hey.

I'm currently looking for a countdown script, which is based on the server's time. I've only found scripts, that's based on the local computer's time, which means the output of the script changes, when the time on the computer is changed.

And I want to make a public announcement which counts down to something - and should output the same at every person.

I'm not that familiar with JavaScript, I know some jQuery - if anyone can supply any links or can help me with this, I'd appreciate it.

What im trying to do is have the page auto refresh after the time countdown has expired. Here is the java code for the counter how would it be possible to add a autorefresh after the counter has reached 0 time left.

Code:

function ulticountdown(time, id, format, keepCounting, zero, langarray){
     timeleft = time;
     var countUp = false;
     if (timeleft < 0) {
       if (keepCounting == 0) {
         timeleft = 0; 
       } else {
         timeleft *= -1;        
         countUp = true;
       }
     }
     seconds = timeleft%60;
     timeleft -= seconds;
     timeleft = timeleft/60;
     minutes = timeleft%60;
     timeleft -= minutes;
     timeleft = timeleft/60;
     hours = timeleft%24;
     timeleft -= hours;
     days = timeleft/24;
     var counterstring = '';

     if (zero == 1) {
       if (seconds < 10) {
         seconds = '0'+seconds; 
       }
       if (minutes < 10) {
         minutes = '0'+minutes; 
       }
       if (hours < 10) {
         hours = '0'+hours; 
       }
     }
     if (format == 1) {     
       
       if (days != 0) {
         if (days != 1) {
           counterstring = counterstring+" "+days+" "+langarray[1];
         } else {
           counterstring = counterstring+" "+days+" "+langarray[0];
         }
       }
       if (hours != 0) {

         if (hours != 1) {
           counterstring = counterstring+" "+hours+" "+langarray[3];
         } else {
           counterstring = counterstring+" "+hours+" "+langarray[2];	 
	 }
       }
       if (minutes != 0) {
         if (minutes != 1) {
           counterstring = counterstring+" "+minutes+" "+langarray[5];
         } else {
           counterstring = counterstring+" "+minutes+" "+langarray[4];
	 
	 }
       }
       if (seconds != 1) {
         counterstring = counterstring+" "+seconds+" "+langarray[7];
       } else {
         counterstring = counterstring+" "+seconds+" "+langarray[6];
       
       }
    }  else if (format == 2) { 
       if (days != 0) {
         if (days != 1) {
           counterstring = counterstring+" "+days+" "+langarray[1];
         } else {
           counterstring = counterstring+" "+days+" "+langarray[0];
         }
       }
       if (hours != 0) {

         if (hours != 1) {
           counterstring = counterstring+" "+hours+" "+langarray[3];
         } else {
           counterstring = counterstring+" "+hours+" "+langarray[2];	 
	 }
       }
       if (minutes != 0) {
         if (minutes != 1) {
           counterstring = counterstring+" "+minutes+" "+langarray[5];
         } else {
           counterstring = counterstring+" "+minutes+" "+langarray[4];
	 
	 }
       }

    } else if (format == 3) {     
       if (days != 0) {
         if (days != 1) {
           counterstring = counterstring+" "+days+" "+langarray[1];
         } else {
           counterstring = counterstring+" "+days+" "+langarray[0];
         }
       }
       if (hours != 0) {

         if (hours != 1) {
           counterstring = counterstring+" "+hours+" "+langarray[3];
         } else {
           counterstring = counterstring+" "+hours+" "+langarray[2];	 
	 }
       }
    
    } else if (format == 4) {     
       if (days != 0) {
         if (days != 1) {
           counterstring = counterstring+" "+days+" "+langarray[1];
         } else {
           counterstring = counterstring+" "+days+" "+langarray[0];
         }
       }
   
    } else if (format == 5) {     
       if (days != 0) {
         if (days != 1) {
           counterstring = counterstring+" "+days+" "+langarray[1];
         } else {
           counterstring = counterstring+" "+days+" "+langarray[0];
         }
       }
       counterstring += " "+hours+":"+minutes+":"+seconds;
    } else if (format == 6) {     
       counterstring = days;
    }else {     
    // we should never get here, but for safety add the last one as default case.
      if (days != 0) {
         if (days != 1) {
           counterstring = counterstring+" "+days+" "+langarray[1];
         } else {
           counterstring = counterstring+" "+days+" "+langarray[0];
         }
       }
       counterstring += " "+hours+":"+minutes+":"+seconds;    
     }

var newdiv = document.createElement("div");
newdiv.innerHTML = counterstring;
var olddiv = document.getElementById("counter"+id);
var parent = olddiv.parentNode;
parent.removeChild(olddiv);
newdiv.id = "counter"+id;
parent.appendChild(newdiv);


if (countUp == true) {
  newtime = time-1;
} else {
  newtime = time-1;
}
setTimeout("ulticountdown("+newtime+","+id+","+format+", "+keepCounting+", "+zero+", langarray)",1000);
}

I am new to JavaScript and am enrolled in an introductory class. My assignment is to create JavaScript for a Web page that counts down the time left until several events. I have been working on this code for several hours now, and I have done everything the textbook instructs me to do, yet when I load the Web page I still get blank fields where my countdown info should be.

I would really appreciate it if someone could look through the code I've created and give me some pointers.

I have an .htm file and an external .js file. The .htm file is:
Code:

<html>
<head>
<!-- 
   New Perspectives on JavaScript
   Tutorial 2
   Review Assignment

   Events in Dixon
   Author: 
   Date:   

   Filename:         events.htm
   Supporting files: dates.js, dixon.css, logo.jpg
-->

<title>Upcoming Events at Dixon</title>
<link href="dixon.css" rel="stylesheet" type="text/css" />

<script type="text/javascript" src="dates.js"></script>

<script type="text/javascript">
	function showCountdown() {
		var today = new Date("December 1, 2007 6:31:45");
		var Date1 = new Date("January 14, 2007 10:00:00");
		var Date2 = new Date("May 21, 2007 12:00:00");
		var Date3 = new Date("July 4, 2007 21:00:00");
		var Date4 = new Date("September 1, 2007 12:00:00");
		var Date5 = new Date("December 1, 2007 11:30:00");
		var Date6 = new Date("December 31, 2007 15:30:00");
		document.eventform.thisDay.value = showDateTime(today);
		changeYear(today, Date1);
		changeYear(today, Date2);
		changeYear(today, Date3);
		changeYear(today, Date4);
		changeYear(today, Date5);
		changeYear(today, Date6);
		document.eventform.count1.value = countdown(today, Date1);
		document.eventform.count2.value = countdown(today, Date2);
		document.eventform.count3.value = countdown(today, Date3);
		document.eventform.count4.value = countdown(today, Date4);
		document.eventform.count5.value = countdown(today, Date5);
		document.eventform.count6.value = countdown(today, Date6);
}
</script>

</head>

<body onload="setInterval('showCountdown()',100)">

<form name="eventform" id="eventform" action="">

<div id="links1">
   <a href="#">Home</a>
   <a href="#">City Services</a>
   <a href="#">City Agencies</a>
   <a href="#">Mayor's Office</a>
   <a href="#">News Today</a>
   <a href="#">Upcoming Events</a>
</div>
<div id="logo">
   <img src="logo.jpg" alt="New Years Bash" />
</div>
<div id="links2">
   <a href="#">Site Map</a>
   <a href="#">Search Engine</a>
   <a href="#">Public Notices</a>
   <a href="#">Survey Form</a>
   <a href="#">Contact Us</a>
   <a href="#">E-Government</a>
</div>


<div id="main">
<h3>Countdown to Upcoming Events</h3>
<table>
<tr>
   <td></td>
   <th style="text-align: right">Current Time </th>
   <td><input name="thisDay" id="thisDay" readonly="readonly" size="40" /></td>
</tr>
<tr>
   <th>Event</th>
   <th>Starting Time</th>
   <th>Countdown to Event</th>
</tr>
<tr>
   <td><input value="Heritage Day" readonly="readonly" size="20" /></td>
   <td><input value="Jan 14 at 10:00 am"readonly="readonly" size="20" /></td>
   <td><input name="count1" id="count1" size="40" /></td>
</tr>
<tr>
   <td><input value="Spring Day Rally" readonly="readonly" size="20" /></td>
   <td><input value="May 21 at 12:00 pm"readonly="readonly" size="20" /></td>
   <td><input name="count2" id="count2" size="40" /></td>
</tr>
<tr>
   <td><input value="July 4th Fireworks" readonly="readonly" size="20" /></td>
   <td><input value="Jul 4 at 9:00 pm" readonly="readonly" size="20" /></td>
   <td><input name="count3" id="count3" size="40" /></td>
</tr>
<tr>
   <td><input value="Summer Bash" readonly="readonly" size="20" /></td>
   <td><input value="Sep 1 at 12:00 pm" readonly="readonly" size="20" /></td>
   <td><input name="count4" id="count4" size="40" /></td>
</tr><tr>
   <td><input value="Holiday Party" readonly="readonly" size="20" /></td>
   <td><input value="Dec 1 at 11:30 am" readonly="readonly" size="20" /></td>
   <td><input name="count5" id="count5" size="40" /></td>
</tr>
<tr>
   <td><input value="New Year's Bash" readonly="readonly" size="20" /></td>
   <td><input value="Dec. 31 at 3:30 pm" readonly="readonly" size="20" /></td>
   <td><input name="count6" id="count6" size="40" /></td>
</tr>
</table>
</div>

</form>
</body>
</html>

The external .js file is:
Code:

/*
   New Perspectives on JavaScript
   Tutorial 2
   Review Assignment

   Author: 
   Date:  
 
   Function List:
   showDateTime(time)
      Returns the date in a text string formatted as:
      mm/dd/yyyy at hh:mm:ss am

   changeYear(today, holiday)
      Changes the year value of the holiday object to point to the
      next year if it has already occurred in the present year

   countdown(stop, start)
      Displays the time between the stop and start date objects in the
      text format:
      dd days, hh hrs, mm mins, ss secs
*/

function showDateTime(time) {
   date = time.getDate();
   month = time.getMonth()+1;
   year = time.getFullYear();

   second = time.getSeconds();
   minute = time.getMinutes();
   hour = time.getHours();

   ampm = (hour < 12) ? " am" : " pm";
   hour = (hour > 12) ? hour - 12 : hour;
   hour = (hour == 0) ? 12 : hour;

   minute = minute < 10 ? "0"+minute : minute;
   second = second < 10 ? "0"+second : second;

   return month+"/"+date +"/"+year+" at "+hour+":"+minute+":"+second+ampm;
}

function changeYear(today, holiday) {
	year = today.getFullYear();
	holiday.setFullYear(year);
	(holiday < today) ? ++year : year;
	holiday.setFullYear(year);
}

function countdown(start, stop) {
	var time = stop - start;
	var days = Math.floor(time/(1000*60*60*24);
	var hours = Math.floor(time/1000*60*60);
	var minutes = Math.floor(time/1000*60);
	var seconds = Math.floor(time/1000);
	return days +"days, "+ hours +"hrs, "+ minutes +"mins, "+ seconds +"secs"+;
}

If there is any more information that is needed, I will do my best to give that, as well.

Thanks!

Can someone help me modify this script be set to a specific Time Zone rather than picking up the time from the local machine?
I want it to countdown to 6:00 am EST.

http://javascript.internet.com/time-...countdown.html

Can anyone tell me what to add where if it is possible? Thank you in advance.

Hello everyone,

I am completely new to javascripts. I want to have a count down timer on my webpage. I already found a script, but it does not do everything I want it to do.
I couldn't find a script that did everything I need. I need it to do the following things:

- Use the time zone GMT+1
- Reset everyday at a specific time
- From 15:00 till 17:30: A countdown (so it shows 2 hours and 30 minutes from the start and count's down to 0 (which will be 17:30)
- During 15:00 till 17:30 it shows: "The game is playing"
- Once it is 17:30 I want it to reset and countdown till the next day 15:00
- From 17:30 till 15:00 next day it says: "The game will start in"

So it is actually 2 countdown clocks in one javascript. One countdown from 15:00 to 17:30 (whilst the game is playing) and one directly starting after it from 17:30 till 15:00 next day. But both are displayed on the same spot.
The countdown will be in text. No buttons or fancy images etc.

Hope you can help me out. Thanks

Code:

<html>
<head>

<script type = "text/javascript">

function getSeconds() {
var now = new Date();
var time = now.getTime();  // time now in milliseconds
var midnight = new Date(now.getFullYear(),now.getMonth(),now.getDate(),0,0,0); // midnight 0000 hrs
// midnight - change time hh,mm,ss to whatever time required, e.g. 7,50,0 (0750)
var ft = midnight.getTime() + 86400000;  // add one day
var diff = ft - time;  
diff = parseInt(diff/1000);
if (diff > 86400) {diff = diff - 86400}
startTimer (diff);
}


var timeInSecs;
var ticker;

function startTimer(secs){
timeInSecs = parseInt(secs);
ticker = setInterval("tick()",1000); 
tick(); // to start counter display right away
}

function tick() {
var secs = timeInSecs;
if (secs>0) {
timeInSecs--;
}
else {
clearInterval(ticker); // stop counting at zero
//getSeconds();  // and start again if required
}

var hours= Math.floor(secs/3600);
secs %= 3600;
var mins = Math.floor(secs/60);
secs %= 60;
var result = ((hours < 10 ) ? "0" : "" ) + hours + " hours " + ( (mins < 10) ? "0" : "" ) + mins
                  + " minutes " + ( (secs < 10) ? "0" : "" ) + secs + " seconds";
document.getElementById("countdown").innerHTML = "The game will start in " + result;
}


</script>

</head>

<body onload = "getSeconds()">

<span id="countdown" style="font-weight: bold;"></span>

</body>
</html>

Reply With Quote




01-07-2015, 10:11 PM #2
Old Pedant View Profile View Forum Posts

Supreme Master coder! Join Date Feb 2009 Posts 28,311 Thanks 82 Thanked 4,754 Times in 4,716 Posts

First of all, move your JavaScript where it belongs: Just before the </body> tag. Then you don't need stuff such as onload='....'

Here's my attempt at it: Code:

<!DOCTYP html>
<html>
<head>
    <title>Game play starts at 17:30</title>
</head>

<body>
Other stuff...<br/><br/>

<span id="countdown" style="font-weight: bold;"></span>

<br/><br/>Other stuff...<br/><br/>

<script type="text/javascript">
var timer = null;

function tick( )
{
    var msg = document.getElementById("countdown");
    var now = new Date();
    var yr = now.getFullYear(); var mon = now.getMonth(); var dy = now.getDate();
    var startat = new Date(yr,mon,dy,15,0,0);
    var endat = new Date(yr,mon,dy,17,30,0);
    if ( now.getTime() < startat.getTime() )
    {
        msg.innerHTML = "The game will start at 17:30";
    } else if ( now.getTime() > endat.getTime() )
    {
        msg.innerHTML = "The game started at 17:30";
    } else {
        var sec = Math.floor( ( endat.getTime() - now.getTime() ) / 1000 );
        var min = Math.floor ( sec / 60 );
        sec %= 60;
        var hr = Math.floor ( min / 60 );
        min %= 60;
        if ( min < 10 ) min = "0" + min;
        if ( sec < 10 ) sec = "0" + sec;
        msg.innerHTML = "The game will start in " + hr + ":" + min + ":" + sec;
    }
}
tick(); // immediate start
timer = setInterval( tick, 1000 ); // every second
</script>

</body>
</html>

Hi

Code:

var err_str="";
function validate_grid(value,id,ind)
{
 $("#result").html(" ").show();
 if(ind==1 || ind==2)
  {
  var patt=/^([0][0-9]|[1][0-9]|[2][0-3])[:]{1}[0-5][0-9]$/;
  if(!patt.test(value))
   {
	mygrid.setCellTextStyle(id,ind,"background-color:yellow;");
	if(err_str!="")
		err_str+="\n"+(ind+1)+".Enter numbers and : only..";
	else
		err_str=(ind+1)+".Enter numbers and : only";
	return false;
   }
    else
      {
	mygrid.setCellTextStyle(id,ind,"background-color:white;");
	return true;
      }
  }
}
alert(err-str);

here ind==1 is from_time and ind==2 is to_time,i need to validate time as to_time must be always greater than from-time,if condition fails an alert msg should populate.time format is[05:00]as it is in string format im unable to do the validation for it.(ex:from-time=08:00 to-time=07:59 condition fails)

thank you.

Hello im using dhtmlx grid in this cells i have from time and to time (i.e ind==1 and ind==2) i need to validate time where to-time must be greater than from-time else it should alert an message,i have writeen a normal Regular expression for the time validation.as the time is i string format i.e[05:00],please can any one send me code for that.
Code:

var err_str="";
function validate_grid(value,id,ind)
	{
	if(ind==1 || ind==2)
		{
			var patt=/^([0][0-9]|[1][0-9]|[2][0-3])[:]{1}[0-5][0-9]$/;
			if(!patt.test(value))
			{
				mygrid.setCellTextStyle(id,ind,"background-color:yellow;");
				if(err_str!="")
					err_str+="\n"+(ind+1)+".Enter numbers and : only..";
				else
					err_str=(ind+1)+".Enter numbers and : only";
				return false;
			}
			else
			{
				mygrid.setCellTextStyle(id,ind,"background-color:white;");
				return true;
			}
		}
}

hi im using dhtml xgrid where i need to do validation for time ,(from-time and to-time i.e ind==1 and ind==2 ) to-time must be greater than from-time else i need to alert a message to-time must be greater than from-time.
can any one send me the code for it time format is[05:00].
Code:

var err_str="";
function validate_grid(value,id,ind)
	{
	$("#result").html(" ").show();
		if(ind==1 || ind==2)
		{
			var patt=/^([0][0-9]|[1][0-9]|[2][0-3])[:]{1}[0-5][0-9]$/;
			if(!patt.test(value))
			{
				mygrid.setCellTextStyle(id,ind,"background-color:yellow;");
				if(err_str!="")
					err_str+="\n"+(ind+1)+".Enter numbers and : only..";
				else
					err_str=(ind+1)+".Enter numbers and : only";
				return false;
			}
			else
			{
				mygrid.setCellTextStyle(id,ind,"background-color:white;");
				return true;
			}
		}
}

I'm not really a Java writer, so I don't know how to do this myself, though I imagine it would be pretty simple.
I am looking to add a script to a webpage that allows users to input a time manually, and have it converted to GMT/Zulu time and display the converted time. I have seen a lot of time zone conversion scripts online, but they all just convert whatever the current system time is to another time zone. I am looking for a script that allows users to convert a time and show the zulu time, for times other than the current time. The time zone the inputed local time would be in is +4:30 (Kabul). I don't really care about style or aestehtics, just a simple script I can insert into a web page to have a time input field. The converted output time can appear in another field, a popup bubble, etc, again style isn't really an issue. It's really just to help people in my job who need to know what the GMT/Zulu time was for certain local times after the fact. One would think it shouldn't be that hard to just subtract 4:30 in your head, but apparently it is.

Sorry if just asking for code outright like this is frowned upon.

hi,

can some one help me how to get the time and date difference? given two time and date with the following format like in textbox A: 2011-05-03 17:35:47.0 and textbox B: 2011-05-03 16:35:47.0 then the output would be: 0 days, 1 hour, 0 minutes, 0 seconds

regards,
verve

This is my first time doing JavaScript I don't what I did wrong here, but the problem its not showing up the current date and time.
Code:

<script language = "JavaScript" type="text/javascript"> 
now = new Date(); 
localtime = now.toString();
 utctime = now.GMTString();
 document.wite("<b>localtime</b>" + localtime + "</br>");
 document.write("<b>utctime</b>" + utctime); 
 </script>

This is what supposed to look like


I have tried using different browser chrome,IE9,Maxtor, and Opera my OS is Win7

I want to make a javascript clock (using Server time and not user computer time). After searching I have found the code on http://www.elated.com/articles/creat...ascript-clock/
The Code is:
PHP Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<style type="text/css">
#clock { font-family: Arial, Helvetica, sans-serif; font-size: 0.8em; color: white; background-color: black; border: 2px solid purple; padding: 4px; }
</style>

<script type="text/javascript">
<!--

function init ( )
{
  timeDisplay = document.createTextNode ( "" );
  document.getElementById("clock").appendChild ( timeDisplay );
}

function updateClock ( )
{
  var currentTime = new Date ( );

  var currentHours = currentTime.getHours ( );
  var currentMinutes = currentTime.getMinutes ( );
  var currentSeconds = currentTime.getSeconds ( );

  // Pad the minutes and seconds with leading zeros, if required
  currentMinutes = ( currentMinutes < 10 ? "0" : "" ) + currentMinutes;
  currentSeconds = ( currentSeconds < 10 ? "0" : "" ) + currentSeconds;

  // Choose either "AM" or "PM" as appropriate
  var timeOfDay = ( currentHours < 12 ) ? "AM" : "PM";

  // Convert the hours component to 12-hour format if needed
  currentHours = ( currentHours > 12 ) ? currentHours - 12 : currentHours;

  // Convert an hours component of "0" to "12"
  currentHours = ( currentHours == 0 ) ? 12 : currentHours;

  // Compose the string for display
  var currentTimeString = currentHours + ":" + currentMinutes + ":" + currentSeconds + " " + timeOfDay;

  // Update the time display
  document.getElementById("clock").firstChild.nodeValue = currentTimeString;
}

// -->
</script>

</head>
<body onload="updateClock(); setInterval('updateClock()', 1000 )">

<div>
  <span id="clock">&nbsp;</span>
</div>


</body>
</html> 


The problem is that it (the code above) is using the users computer time.

(I found (in the comments of http://www.elated.com/articles/creat...ascript-clock/) that I should use:
PHP Code:
var currentTime = [serverValue goes here]; 


But I don't really know what should I put in the "serverValue goes here" ..... )


So how can I make this code to use the server time (and not the users time)?


Any Suggestion Will Be Helpfull

Hi,

I'm not too familiar with javascript but I am trying to find a script which I can enter a specific time and date and when that date is reached the script will alert me with a desired message. (not looking for a calendar)

Help would be appreciated

Harry

Hello everyone! I hope you can help me. I am writing a submit form that has to have an indication if a form is information is missing. I have followed along the steps with my text and I can't seem to figure out what I am doing wrong. Can anyone help me?

Here is my code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD.HTML 4.01 Transitional//EN"

"http://www.w3.org/TR/htm14/loose.dtd">


<html xmlns="http://www.w3.org/1999/xhtml">

<head>



<title>Kudler Fine Foods Contact Page</title>

<meta http-equiv="Content-type" content="text/html; charset=iso-8859-1">



<!---Kami Demnyan

21 December 2009-->



<script type="text/javascript">

/*<![CDATA[*/

<!--This code ensures that the zip code and telephone numbers are actual numerical digits, not letters-->

function checkForNumber(fieldValue) {
var numberCheck = isNaN(fieldValue);
if (numberCheck == true) {
window.alert ("Please enter a numerical value");
return false;
}
}

<!--This code ensures that all of the fields contain text, its not functioning, I'm using page 263 in the text as my

guide-->

function submitForm() {
if (document.forms[0].name.value == ""
|| document.forms[0].address.value == ""
|| document.forms[0].city.value == ""
|| document.forms[0].state.value == ""
|| document.forms[0].zip.value == ""
|| document.forms[0].phone.value == ""
|| document.forms[0].email.value == "") {
window.alert("Please enter your missing information");
return false;
}
else
return true;
}


/*]]>*/

</script>

</head>


<body>


<h1> KUDLER FINE FOODS </h1>

<h2> JOIN OUR MAILING LIST</h2>

<!--This is where the user will input all of their information to join the mailing list-->

<form action="completeform.html" method="get" onsubmit="return onSubnit();"

enctype="application/x-www-form-urlencoded">


<p>Name<br />

<input type="text" name="name" size="50" /></p>



<p>Address<br />

<input type="text" name="address" size="50" /></p>



<p>City, State, Zip <br />

<input type="text" name="city" size="30" />

<input type="text" name="state" size="3" />

<input type="text" name="zip" size="10"; onchange="return checkForNumber(this.value)"; /></p>



<p>Telephone<br />

<input type="text" name="phone" size="25" onchange="return checkForNumber(this.value)"; /></p>



<p>Email Address<br />

<input type="text" name="email" size="50" /></p>

<!--This is where the submit and reset buttons are located-->


<p><input type="submit" value="Submit Form" />
<p><input type="reset" value="Reset Form" />


</form>

</body>

</html>

ALSO: My instructor does not want me to use the onchange tag, is there a suitable replacement for that?

Any help would be greatly appreciated, thank you.

Kami

Hi All,

i want to achieve an effect like the following, please help

1. i want to get the current time, possibility no from client computer ( sometimes their time is wrong)? i dont know whether can achieve but if cannot, then never mind, just get from client computer.

2. for example now is 1:25 am, i want to generate dynamically every half an hour timing from 2 am(round up) till for example 11 am

something like

<select>
<option>2:00</option>
<option>2:30</option>
................
<option>11:00</option>
</select>

for me this is a bit complicated, anybody can help me?
<option>3:00</option>