Strange problem with JavaScript code

Question

Hi Masters Of Web Development, first I want to say that I did not believe in my eyes - I've got a piece of javascript that works just fine in IE7, and don't in Firefox!!! :)))) That was little joke. :) So I already told you the problem (it wasn't joke), now I'm pasting the javascript:

<script type="text/javascript">

<!-- This script and many more are available free online at -->
<!-- The JavaScript Source!! http://javascript.internet.com -->

<!-- Begin
var ms;
ms = %%CONTENT_REFRESH%% - 5;
var stop;
stop = 0;
var myvalue;

function display() {
    if (!stop) {
        setTimeout("display();", 1000);
    }
    thetime.value = myvalue;
}
function recalc() {
    var hours;
    var minutes;
    var seconds;

    ms = ms - 1;
    hours = Math.floor(ms / 3600);
    minutes = Math.floor(ms / 60);
    if (minutes < 10) {
        minutes = "0"+minutes;
    }
    seconds = ms - (minutes*60) - (hours*3600);
    if (seconds < 10) {
        seconds = "0"+seconds;
    }
    myvalue = hours+":"+minutes+":"+seconds;
    thetime.value = myvalue;
    if (myvalue == "0:00:00") {
        stop = 1;
    }
    if (!stop) {
        setTimeout("recalc();", 1000);
    }
}
// End -->
</SCRIPT>

This is very old script I know that. It takes my current remaining song time, from my winamp and countdowns in site. But as I said, it does not work in Firefox.

Body and code that calls countdown timer looks like this:

<body class="playlist_body" onLoad="recalc();display();">

Time Left In Song: <INPUT align="center" TYPE="text" Name="thetime" size=5 />

</body>

//Edit: I look at FireBug, and I saw the following error:

thetime is not defined
recalc()playlist.cgi (line 87)
function onload(event) { recalc(); display(); }(load )1 (line 2)
error source line: [Break on this error] thetime.value = myvalue;\n

Do you get any errors in Firefox's Javascript console, or the Firebug console? — jason
– jason, Commented Oct 23, 2009 at 2:26
HOW MUCH STUPID I CAN BE SOMETIMES!!! I forgot to look in FireBug! Yes, it gave error. I'm editing my question with the Error in it! Thanks Jason! :) — Spoonk
– Spoonk, Commented Oct 23, 2009 at 2:30

SLaks · Accepted Answer · 2009-10-23 02:33:00Z

3

The problem is that it's accessing DOM elements by name.

Add the following code to the top to declare a variable for the thetime element, add id="thetime" to the INPUT, and add a call to init(); in onload in the body element.

var thetime;

function init() {
    thetime = document.getElementById('thetime');
}

By the way, you can replace the textbox with a regular DIV element by setting the div's ID to thetime, and replacing thetime.value with thetime.innerHTML.

Also, it's better to call setTimeout with a function instead of a string; you should replace "display();" and "recalc();" with display and recalc respectively.

answered Oct 23, 2009 at 2:33

SLaks

891k182 gold badges1.9k silver badges2k bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Spoonk Over a year ago

Well... it looks like a clever decision, but... It doesn't talk to me nothing. If... I may ask you to wright it to me...

SLaks Over a year ago

What happens when you try? Make sure you added init(); to the beginning of onload=.

Spoonk Over a year ago

DAMN!!! It wont work before, because I added init(); after recalc and display! Now when you told me, to add it in the begining, it works JUST FINE!!! Thanks a lot man! :))

olliej · Accepted Answer · 2009-10-23 02:33:11Z

3

IE has a "feature" where an element with a name attribute is placed in the window object, eg.

<div name=foo></div>

Will give you a variable "foo" -- this is non-standard, you should do

document.getElementByName("foo")

To get the timer output element.

answered Oct 23, 2009 at 2:33

olliej

36.9k9 gold badges61 silver badges55 bronze badges

2 Comments

Mike Blandford Over a year ago

It would be document.getElementsByName("foo")[0]. "getElementByName" is not a function

Spoonk Over a year ago

I didn't understand anything... I'm newby with this... :(

Mike Blandford · Accepted Answer · 2009-10-23 02:33:51Z

0

var thetime = document.getElementById("thetime");

and add id="thetime" instead of just name="thetime" to the input

answered Oct 23, 2009 at 2:33

Mike Blandford

4,0124 gold badges32 silver badges32 bronze badges

2 Comments

SLaks Over a year ago

This will fail because the element won't exit yet.

Mike Blandford Over a year ago

that depends on where you do it.

Collectives™ on Stack Overflow

Strange problem with JavaScript code

3 Answers 3

3 Comments

2 Comments

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

3 Comments

2 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related