JavaScript code problem?

[Rawnern]

var fd = 255;

function fading(){ 
if(fd>0) {
fd-=200;
document.getElementById("female").style.color="rgb("+fd+","+fd+","+fd+")";
setTimeout("fading()",20); 
}
else
fd = 255;
}

This code is meant to make a text fade, but I do not see any results. I tried adding a { after else, but then not anything of my code worked. i have tried a lot of things, but I can't see the problem at all.

[nameistaken1]

Did the text immediately fade so you cannot see it? Or did absolutely nothing happen?

Right now, you're taking away 200 from 250 every 20 milliseconds. With 1000 milliseconds in a second, you won't notice that at all.

When you added { after else, the } that closes the function closed the else instead.
Write it like this:

function fading()
    { 
    if(fd>0) 
    {
       fd-=200;
       document.getElementById("female").style.color="rgb("+fd+","+fd+","+fd+")";
       setTimeout("fading()",20); 
     }
    else
    {
       fd = 255;
     }   
}

Finally, getByID function - use single quotes. ' '. <-Those represent ID's, double quotes represent strings.

[Rawnern]

At 4/29/12 02:18 AM, nameistaken1 wrote: Did the text immediately fade so you cannot see it? Or did absolutely nothing happen?

Right now, you're taking away 200 from 250 every 20 milliseconds. With 1000 milliseconds in a second, you won't notice that at all.

When you added { after else, the } that closes the function closed the else instead.
Write it like this:

function fading()
{
if(fd>0)
{
fd-=200;
document.getElementById("female").style.color="rgb("+fd+","+

fd+","+fd+")";

setTimeout("fading()",20);
}
else
{
fd = 255;
}
}

Finally, getByID function - use single quotes. ' '. <-Those represent ID's, double quotes represent strings.

Now, it works. I was kinda tired yesterday and did not see the problem at all. Thanks for noticing the double quotes, too!

But in Jshint I get the following messages:

Line 1: "use strict";
Use the function form of "use strict".

I use "use strict"; for the whole script. Ignore this or what?

Line 16: setTimeout('fadefemale()',20);
Implied eval is evil. Pass a function instead of a string.

Line 31: setTimeout('fademale()',20);
Implied eval is evil. Pass a function instead of a string.

I do not understand this problem.

Line 98: if(event.keyCode=='13') {getname(); }
Expected '===' and instead saw '=='.

Line 99: if(event.keyCode=='65') {fadefemale(); fadefemale(); }
Expected '===' and instead saw '=='.

Line 100: if(event.keyCode=='83') {male(); fademale(); }
Expected '===' and instead saw '=='.

I tried to change == to ===, but then the whole key-thing would not work at all. But really... what is the diffrence?

Can you help me with these errors/warnings? Just keep in mind that the whole code works as it should. If you need, I could send you the whole JavaScript document.

[nameistaken1]

For setTimeout(), use double quotes. You should be passing it an already declared string that represents your function. Single represents ID's, or properties, (in this case, it is an unknown ID/property so it attempts to declare something new - a string) double quotes are strings. Function names, are represented by strings.

So, getElementByID <- use single, to give it an ID
setTimeout() <- use double, to pass it the name of a function in string format, so it can call it
That should fix line 16, and 31.

Try doing something like, if event occurs and event is equal to... then....
if(event && event.keyCode == 13).

Not too sure how Javascript is interrupted in real time, as I've never used or learned it, but I believe it will interrupt your statement whether there is an event or not, so there is nothing to compare (hence why == won't work).

[Rawnern]

Thanks for taking time helping me with this program I am making in JavaScript. Made it a lot easier because I am still learning to program.

[nameistaken1]

No problem, glad I could help.

[liljim]

Post your full script (or if it's too big, upload it somewhere) if you want more help with this. Anyway:

Be careful how you're using your braces ({}). Please see: http://www.youtube.com/watch?v=hQVTIJBZook (specifically around 12:20 (semicolon insertion and then later on), but watch the whole thing anyway).

The use strict issue is because you're doing that stuff outside of the function, rather than in its context:

"use strict";
function whatever() { }

rather than

function whatever() {
	"use strict";
}

The quotes don't matter (as in, you can use single or double quotes) in the document.getElementById stuff. The warnings you're getting about your setTimeouts are easy to identify - pass the function, not a string. So instead of:

setTimeout("fading()",20);

or:

setTimeout('fading()',20);

use:

setTimeout(fading, 20);

Your equality warnings in whatever other code you haven't pasted (Line 99: if(event.keyCode=='65') {fadefemale(); fadefemale(); } Expected '===' and instead saw '=='.) etc are due to you not using "===" as you figured.

When you do that in the code you've pasted, you're comparing a string (you are wrapping the number in quotes) to the keyCode (which is a number), so of course it will fail (the == doesn't care about that, but avoid using it for reasons demonstrated in the video above).

Change:

event.keyCode=='65' // <-- single quotes around the 65 make it a string

to:

event.keyCode === 65 // num is exactly equal to num in both value AND type

(see 14:40 of that video (and later for further examples) for an explanation of that).

Here's how your original code might look (whether or not it will work is another matter, but it should pass validation):

var fd = 255;
function fading() { 
    "use strict";
    if (fd > 0) {
       fd -= 200;
       document.getElementById("female").style.color = "rgb("+fd+","+fd+","+fd+")";
       setTimeout(fading, 20); 
    } else {
       fd = 255;
    }   
}

That's really not the best way of going about "use strict", though. See:

http://ejohn.org/blog/ecmascript-5-strict-mode-json-and-more /

And look for the part about anonymous functions.