It works in firefox and displays 30 seconds, but when I try it in IE7, the countdown starts at 9 seconds no matter what.

<script language="JavaScript" type="text/javascript">

var x = 31
var y = 1
function startClock(){
if(x!=='Done'){
x = x-y

document.frm.clock.value = x

setTimeout("startClock()", 1000)

}

if(x==0){

x='Done'

document.frm.clock.value = x

success.location.href="success.php?ad="+document.frm.id.value+"&verify="+document.frm.verify.value

}}

</script>

</head>

			
			<body leftmargin="0" rightmargin="0" topmargin="0" bottommargin="0" onLoad="startClock()">

I think you are confusing IE's interpreter by changing the data type in a comparison in mid-run.

While JS normally doesn't care about data types, it might configure the comparison or the parameter pass to work with the types of values it finds the first time the comparison occurs.

Another possibility is that the var is making the variable x not start over the next time you run the script with the same load of the web page.

Try using a number such as -100, instead of changing a numeric value to a string.

Try using two different functions, one for the initial call, and one for the iteration.

Alright, tried this, and it didn't work.

<script language="JavaScript" type="text/javascript">

var x = 31
var y = 1
function startClock(){
if(x!=0){
x = x-y

document.frm.clock.value = x

setTimeout("startClock()", 1000)

}

if(x==0){

document.frm.clock.value = "Done"

success.location.href="success.php?ad="+document.frm.id.value+"&verify="+document.frm.verify.value

}}

</script>

</head>

			
			<body leftmargin="0" rightmargin="0" topmargin="0" bottommargin="0" onLoad="startClock()">

Could you give me an example of what you meant by

Try using two different functions, one for the initial call, and one for the iteration.

Cause I am a bit of a n00b. :)

Thanks

Ok I think i know the problem. Here is the actual code I am using:

<script language="JavaScript" type="text/javascript">

<?php
echo "var x = ".$time;
?>

var y = 1
function startClock(){
if(x!=0){
x = x-y

document.frm.clock.value = x

setTimeout("startClock()", 1000)

}

if(x==0){

document.frm.clock.value = "Done"

success.location.href="success.php?ad="+document.frm.id.value+"&verify="+document.frm.verify.value

}}

</script>

</head>

			
			<body leftmargin="0" rightmargin="0" topmargin="0" bottommargin="0" onLoad="startClock()">

See, I am using php to check the database for the time, but if I put the line

<?php
echo "var x = ".$time;
?>

inside of the function, It will correctly display 30 seconds, but because I put it in the loop/ function, it does not count down. So what do I do?

> when I try it in IE7, the countdown starts at 9 seconds no matter what.
Works fine for me.

Even though the semicolons are optional in Javscript, it's a good practice to explicitly put them to avoid some subtle bugs.

A better solution would be to use setInterval.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
            "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>Example</title>
    <script type="text/javascript">
    var t = 10; /* This would come from PHP */
    var decr = 1;
    var handle = null;
    
    function startTimer() {
        var e = document.getElementById("time");
        e.innerHTML = t;
        handle = setInterval(function() {
            if(t == 0) {
                clearInterval(handle);
                window.location.href = "http://www.google.co.in/";
            } 
            else {
                t -= decr;
                e.innerHTML = t;
            }                
        }, decr * 1000);
    }
    window.onload = startTimer;
    </script>
</head>
<body>
    <div>The time remaining is <span id="time"></span></div>
</body>
</html>
This article has been dead for over six months. Start a new discussion instead.