Menu
Hi..I’m new to javascript…So really need some help.
I would like to implement a countdown time.
It will be display when the user selects the hours to be countdown eg. 2 hours, 4 hours from the current date and time in the dropdownlist.
How could I do that..Can someone help me…I need it urgently.
Thanks.
?
[code=php]
<html>
<head><title>test</title></head>
<body>
<form name="countdown" action="">
<select name="hrlist">
<option selected>0 hr</option><option>1 hr</option>
<option>2 hr</option><option>3 hr</option>
<option>4 hr</option><option>5 hr</option>
... and so forth
</select>
<select name="minlist">
<option selected>0 min</option><option>1 min</option>
<option>2 min</option><option>3 min</option>
<option>4 min</option><option>5 min</option>
<option>6 min</option><option>7 min</option>
<option>8 min</option><option>9 min</option>
<option>10 min</option><option>11 min</option>
... and so forth, up to 59 minutes
</select>
<select name="seclist">
<option selected>0 sec</option><option>1 sec</option>
<option>2 sec</option><option>3 sec</option>
<option>4 sec</option><option>5 sec</option>
<option>6 sec</option><option>7 sec</option>
<option>8 sec</option><option>9 sec</option>
<option>10 sec</option><option>11 sec</option>
... and so forth, up to 59 seconds
</select>
<input type="button" name="startbtn" value="Start"
onclick="startCtdn()">
<input type="button" name="stopbtn" value="Stop"
onclick="stopCtdn()">
</form>
<script language="JavaScript">
<!--
var cdhh=0; var cdmm=0; var cdss=0; var cdrr=0;
var cdlds=0;
function startCtdn() {
if (cdrr==0) {
cdlds=(new Date()).getSeconds();
cdhh=document.countdown.hrlist.selectedIndex;
cdmm=document.countdown.minlist.selectedIndex;
cdss=document.countdown.seclist.selectedIndex;
if ((cdhh==0)&&(cdmm==0)&&(cdss==0))
alert('Please select an interval greater than zero.');
else {
cdrr=1;
setTimeout('ctdnTick()',480);
} } }
function ctdnTick() {
if (cdrr==1) {
// If you are a REAL programmer, and not just someone who
// wants homework help, you will know
// how to tell if the seconds have changed and decrement the "cdss"
// variable accordingly.
// If this is for homework, I hope you flunk.
if (cdss<0) {cdss+=60; cdmm--;}
if (cdmm<0) {cdmm+=60; cdhh--;}
if (cdhh<0) {cdhh=0; cdmm=0; cdss=0;}
document.countdown.hrlist[cdhh].selected=true;
document.countdown.minlist[cdmm].selected=true;
document.countdown.seclist[cdss].selected=true;
if ((cdhh==0)&&(cdmm==0)&&(cdss==0)) {
alert("Time's up!");
cdrr=0;
}
else setTimeout('ctdnTick()',480);
} }
function stopCtdn() {
cdrr=0;
}
// -->
</script>
</body></html>
[/code][code=php]
<html>
<head>
<script type="text/javascript">
function countdown(){
var sv=document.getElementById("s").value;
var mv=document.getElementById("m").value;
var hv=document.getElementById("h").value;
if(sv!=00){
var sv=sv-1;
if(sv<10){
sv="0"+sv;
}
}
else if(mv!=00){
var mv=mv-1;
var sv=59;
if(mv<10){
mv="0"+mv;
}
}
else if(hv!=00){
var hv=hv-1;
var mv=59;
var sv=59;
if(hv<10){
hv="0"+hv;
}
}
else{
alert("Countdown finished");
clearInterval(thetimer);
}
document.getElementById("s").value=sv;
document.getElementById("m").value=mv;
document.getElementById("h").value=hv;
}
</script>
</head>
<body>
<input type="text" value="00" size="2" id="h">:
<input type="text" value="00" size="2" id="m">:
<input type="text" value="00" size="2" id="s">
<input type="button" value="Start" onclick="thetimer=setInterval('countdown()', 1000)">
<input type="button" value="Stop" onclick="clearInterval(thetimer)">
</body>
</html>[/code][code=php]
<html>
<head>
<script type="text/javascript">
function writeCookie(name, value, hours) { var expire = ""; if(hours != null) { expire = new Date((new Date()).getTime() + hours * 3600000); expire = "; expires=" +
expire.toGMTString(); } document.cookie = name + "=" + escape(value) + expire; }
function readCookie(name) { var cookieValue = ""; var search = name + "="; if(document.cookie.length > 0) { offset = document.cookie.indexOf(search); if (offset != -1) {
offset += search.length; end = document.cookie.indexOf(";", offset); if (end == -1) end = document.cookie.length; cookieValue =
unescape(document.cookie.substring(offset, end)) } } return cookieValue; }
function countdown(){
var sv=document.getElementById("s").value;
var mv=document.getElementById("m").value;
var hv=document.getElementById("h").value;
if(sv!=00){
var sv=sv-1;
if(sv<10){
sv="0"+sv;
}
writeCookie('countSV', sv, 1000);
}
else if(mv!=00){
var mv=mv-1;
var sv=59;
if(mv<10){
mv="0"+mv;
}
writeCookie('countMV', mv, 1000);
}
else if(hv!=00){
var hv=hv-1;
var mv=59;
var sv=59;
if(hv<10){
hv="0"+hv;
}
writeCookie('countHV', hv, 1000);
}
else{
alert("Countdown finished");
clearInterval(thetimer);
}
document.getElementById("s").value=sv;
document.getElementById("m").value=mv;
document.getElementById("h").value=hv;
}
</script>
</head>
<body>
<input type="text" value="00" size="2" id="h">:
<input type="text" value="00" size="2" id="m">:
<input type="text" value="00" size="2" id="s">
<input type="button" value="Start" onclick="thetimer=setInterval('countdown()', 1000)">
<input type="button" value="Stop" onclick="clearInterval(thetimer); ">
<script>
if (readCookie('countSV') > 0) {
document.getElementById("s").value=readCookie('countSV');
document.getElementById("m").value=readCookie('countMV'); if(readCookie('countMV') == 0) { document.getElementById("m").value='00';}
document.getElementById("h").value=readCookie('countHV'); if(readCookie('countHV') == 0) { document.getElementById("h").value='00';}
thetimer=setInterval('countdown()', 1000)
}
</script>
</body>
</html>
[/code]0.1.9 — BETA 5.28