Countdown timer

DennyLoi · November 4th, 2007, 02:25 PM

Hi everyone.

I am trying to implement a countdown timer which is displayed on my page. The counter needs to countdown from 10 seconds to 0 upon the page loading up.

I tried the following, but am running into difficulties.

//Some other script here^^^^

var counterForm = document.createElement("form");
    counterForm.name = "form";
      counterForm.action = "";
       var para5 = document.createElement("p");
       var counterInput = document.createElement("input");
    counterInput.type = "text";
      counterInput.name = "abc";
      counterInput.id = "abc";
      counterInput.value = '';
      counterForm.appendChild(counterInput);
    para5.appendChild(counterForm);
      document.body.appendChild(para5);

    } //closes this function

    var milisec=0 //simple variables
    var seconds=10
    function display(){
    if (milisec<=0){
    milisec=9
    seconds-=1
    }
    if (seconds<=-1){
    milisec=0
    seconds+=1
    }
    else {
    milisec-=1
    document.counterInput.value=seconds+"."+milisec
    setTimeout("display()",100)
    }

The first part of the code is I snippet of function start() which is called as follows:

<body onload="start()">
</body>

The error Iâm being given is âcounterInput is not definedâ.

I had this script working as a separate page, but when I tried adding into my work, the problems started.

Any suggestions?

allenm · November 26th, 2007, 01:42 PM

1) There are several semicolons missing from your code.
2) Try using:
   document.getElementById("abc").value = seconds + "." + milisec;
     -OR-
   document.form.abc.value = seconds + "." + milisec;
   Instead of:
   document.counterInput.value=seconds+"."+milisec

Hope this helps.

ciderpunx · November 27th, 2007, 08:01 AM

Yeh, counterInput is only in scope in yer start() function. You created a variable counterInput which points to a document element named "input" in that function when you said:

Code:

var counterInput = document.createElement("input");

So you could just give it the name you wanted:

Code:

var counterInput = document.createElement("counterInput");

Or call it with the name input thus:

Code:

document.getElementById("input").value = seconds + "." + milisec;

HTH

--
Charlie Harvey's website - linux, perl, java, anarchism and punk rock: http://charlieharvey.org.uk