/    Sign up×
Community /Pin to ProfileBookmark

[RESOLVED] Simple JavaScript fails 2

Hey,

Sorry for these questions with probably obvious answers, but I don’t have a tutor or coach to guide me through this so I turn to you guys yet again.

I wrote this simple timer-script:

[CODE]
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>

<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<title>Teller</title>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />
<script type=”text/javascript”>
<!–
var teller=0;

function tellen(){
teller++;
window.status=teller+” seconden”;
var timerID=window.setTimeout(“tellen()”,”1000″);
}

// –>
</script>
</head>
<body>
<div>
<input type=”button” value=”Tel!” onclick=”Tellen()” />
<input type=”button” value=”stop de teller!” onclick=”window.clearTimeout(timerID);” />
</div>
</body>
</html>
[/CODE]

It’s valid XHTML 1.0, everything seems logical to me yet nothing will show up in the status bar. Not in IE8 or FF3.5. I adjusted the options in FF3.5 to allow the script to put information in the status bar, but that didn’t help.
I tried looking at references for the window object because I’m learning from an older source(JavaScript 1.5), but didn’t find anything useful (yet)…

Any idea why this doesn’t display the counting in the status bar?

P.S.:Maybe one of you could point me to a site that teaches javascript thourouly and in compliance with the latest standards and technologies/techniques because it seems to me the things I’m learning now could be somewhat outdated.

to post a comment
JavaScript

4 Comments(s)

Copy linkTweet thisAlerts:
@KorNov 11.2009 — Two errors
<i>
</i>onclick="[B][COLOR="Red"]T[/COLOR][/B]ellen()"

You have no [B][COLOR="Red"]T[/COLOR][/B]ellen() function, you have a [B][COLOR="Blue"]t[/COLOR][/B]ellen() function. Javascript is case sensitive.

And:
<i>
</i>[COLOR="Red"]var[/COLOR] timerID=window.setTimeout("tellen()","1000");

written like this, inside the function, the variable is local not global, thus clearTimeout(timerID) founds no variable to clear. Should be:
<i>
</i>var teller=0;
[COLOR="Blue"]var timerID;[/COLOR]
function tellen(){
teller++;
window.status=teller+" seconden";
[COLOR="Blue"]timerID[/COLOR]=window.setTimeout("tellen()","1000");
}


Anyway, that code woun't work for FireFox. Mozilla does not permit the alter of the browser's [I]status[/I].
Copy linkTweet thisAlerts:
@ajajajakauthorNov 11.2009 — Case sensitive...right, again a stupid mistake. Didn't see. These are the things you would need a tutor for. Thanks Kor for putting up once again ?.

It is however possible to make this work if you enable this in FF: Extra->Options->Content->Advanced JavaScript Settings->Change status bar text, but indeed this would only work for testing on your own machine.

Thanks again!
Copy linkTweet thisAlerts:
@jamesbcox1980Nov 11.2009 — Just an afterthought: This is not valid XHTML 1.0 strict. It will pass the W3C validator because of the HTML comment tags around your script, but it will fail in certain browsers (if you want to be technical). You should put your scripts inside of CDATA tags. http://javascript.about.com/library/blxhtml.htm

[code=html]
<script type="text/javascript">
/* <![CDATA[ */
// content of your Javascript goes here
/* ]]> */
</script>
[/code]
Copy linkTweet thisAlerts:
@ajajajakauthorNov 11.2009 — Hey James,

Yes, Be technical! It did indeed pass the W3C validator, but I didn't know about the CDATA tags.

Thanks!
×

Success!

Help @ajajajak spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 6.17,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @nearjob,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,
)...