html - Javascript not displaying in browser - Stack Overflow

admin2025-04-18 1

I'm following a tutorial about creating a timer in JavaScript but I can't get it to show up on my browser. I'm using Dreamweaver and it shows the timer just fine in a "live view" but in the browser window nothing is being displayed. What am I missing?

This is the main HTML page:

<html>
    <head>
        <script type="text/javascript" src="/Timer2.js" />
    </head>
    <body>
        <div id='timer' />
        <script type="text/javascript">
            window.onload = CreateTimer("timer", 90);
        </script>
    </head>
    </body>
</html>

This is the JavaScript timer function. timer2.js:

var Timer;
var TotalSeconds;

function CreateTimer(TimerID, Time) {
    Timer = document.getElementById(TimerID);
    TotalSeconds = Time;

    UpdateTimer()
    window.setTimeout("Tick()", 1000);
}

function Tick() {
    if (TotalSeconds <= 0) {
        alert("Time's up!")
        return;
    }

    TotalSeconds -= 1;
    UpdateTimer()
    window.setTimeout("Tick()", 1000);
}

function UpdateTimer() {
    Timer.innerHTML = TotalSeconds;
}

function UpdateTimer() {
    var Seconds = TotalSeconds;

    var Days = Math.floor(Seconds / 86400);
    Seconds -= Days * 86400;

    var Hours = Math.floor(Seconds / 3600);
    Seconds -= Hours * (3600);

    var Minutes = Math.floor(Seconds / 60);
    Seconds -= Minutes * (60);

    var TimeStr = ((Days > 0) ? Days + " days " : "") + LeadingZero(Hours) + ":" + LeadingZero(Minutes) + ":" + LeadingZero(Seconds)

    Timer.innerHTML = TimeStr ;
}


function LeadingZero(Time) {
    return (Time < 10) ? "0" + Time : + Time;
}

This is the main HTML page:

<html>
    <head>
        <script type="text/javascript" src="/Timer2.js" />
    </head>
    <body>
        <div id='timer' />
        <script type="text/javascript">
            window.onload = CreateTimer("timer", 90);
        </script>
    </head>
    </body>
</html>

This is the JavaScript timer function. timer2.js:

var Timer;
var TotalSeconds;

function CreateTimer(TimerID, Time) {
    Timer = document.getElementById(TimerID);
    TotalSeconds = Time;

    UpdateTimer()
    window.setTimeout("Tick()", 1000);
}

function Tick() {
    if (TotalSeconds <= 0) {
        alert("Time's up!")
        return;
    }

    TotalSeconds -= 1;
    UpdateTimer()
    window.setTimeout("Tick()", 1000);
}

function UpdateTimer() {
    Timer.innerHTML = TotalSeconds;
}

function UpdateTimer() {
    var Seconds = TotalSeconds;

    var Days = Math.floor(Seconds / 86400);
    Seconds -= Days * 86400;

    var Hours = Math.floor(Seconds / 3600);
    Seconds -= Hours * (3600);

    var Minutes = Math.floor(Seconds / 60);
    Seconds -= Minutes * (60);

    var TimeStr = ((Days > 0) ? Days + " days " : "") + LeadingZero(Hours) + ":" + LeadingZero(Minutes) + ":" + LeadingZero(Seconds)

    Timer.innerHTML = TimeStr ;
}


function LeadingZero(Time) {
    return (Time < 10) ? "0" + Time : + Time;
}

Share edited Aug 8, 2012 at 23:58 the Tin Man 161k44 gold badges221 silver badges306 bronze badges asked Aug 8, 2012 at 22:57 Undermine2k 1,4914 gold badges28 silver badges53 bronze badges

1 first <div id='timer' /> should be <div id='timer' ></div> – unloco Commented Aug 8, 2012 at 23:00
1 Are you using your browser's console to see what errors your script is genrating? – Greg Rozmarynowycz Commented Aug 8, 2012 at 23:19

Add a ment |

2 Answers 2

Sorted by: Reset to default 4

You can't self-close a script tag. You MUST write <script ....></script>

Write <div id="timer"></div> and no <div id='timer' />

Delete your </head> at the bottom of the code, and if your script doesn't work again, try src="Timer2.js" without the "/"

转载请注明原文地址:http://conceptsofalgorithm.com/Algorithm/1744931872a275206.html

htmlJavascript not displaying in browserStack Overflow

最新回复(0)