Problem defining a variable and having the script remember it later

Forum Moderators: open

Message Too Old, No Replies

Problem defining a variable and having the script remember it later

Jeremy_H

2:19 am on May 9, 2006 (gmt 0)

Hello,

I have an element that is initially hidden by default. When this element becomes visible, I want any second click to make this element become hidden once again. (I don't want the first click to make it hide, because the click that makes it visible would then hide it).

I've written the following script for the head of my document, but it doesn't seem the variable is remembered each time the script runs.

Variable "lame" is not defined elsewhere.

document.onclick=function(){
if(document.getElementById("s").style.visibility=="visible"){
if(lame=="1"){document.getElementById("s").style.visibility="hidden";lame="0";}
else{var lame="1";}
}}

Any help would be much appreciated.

john_k

3:07 am on May 9, 2006 (gmt 0)

The value is lost because it is defined locally within the onclick function. As soon as the function exits, any local variables are destroyed. You should define it at a global level. Somewhere in the head of your document or maybe right before your document.onclick statement.

Jeremy_H

3:18 am on May 9, 2006 (gmt 0)

Hi John, thanks for the reply,

Would this be more appropriate?

The problem is, it doesn't seem to remember that change either.

Am I moving in the right direction?

Thanks

siMKin

9:22 am on May 9, 2006 (gmt 0)

putting var in front of it makes it a variable that's only accessible in the local scope. So, you should remove that.

But apart from that, why are you storing it in a variable? Why not simply, with every click, determine what the current visibility is and changing it accordingly?

Jeremy_H

3:17 pm on May 9, 2006 (gmt 0)

Thanks for the feedback siMKin,

I need to store the variable because I need the second click to turn off the visibility, otherwise the same click that turns it visible will also turn it invisible.

I have had a good deal of luck with this code:

var lame=0;
document.onclick=function(){
if(document.getElementById("s").style.visibility=="visible"){
if(lame==1){document.getElementById("s").style.visibility="hidden";lame--}
else{lame++}
}}

john_k

3:28 pm on May 9, 2006 (gmt 0)

Even though you had added var lame="0" before the document.onclick statement, you still had else{var lame="1"} within the onclick function. That causes a new variable (with local scope) to be created. That new variable has no relationship with the one you declared prior to the document.onclick statement. So the global scope variable would not be affected when the function ran.

Your newer code no longer declares a variable at the local level. Therefore the references to lame in that function ARE affecting the globally declared variable. And that is what is needed.

[edited by: john_k at 3:30 pm (utc) on May 9, 2006]

Jeremy_H

3:29 pm on May 9, 2006 (gmt 0)

Awesome!

I finally got the bugs worked out.

The script above worked fine, except when the link that made the object visible was clicked. It made the object hidden, but then required two clicks to open it back up.

I just needed to attache a lame--; to that function.

Thanks, everyone!

siMKin

3:35 pm on May 9, 2006 (gmt 0)

I need to store the variable because I need the second click to turn off the visibility, otherwise the same click that turns it visible will also turn it invisible.

maybe i don't understand the problem fully, by why not simply do:

var el = document.getElementById('s'); 
  if(el.style.visibility == 'visible') 
    el.style.visibility = 'hidden'; 
  else if(el.style.visibility == 'hidden') 
    el.style.visibility = 'visible';

Jeremy_H

9:59 pm on May 9, 2006 (gmt 0)

That is a part of the script, but I was only trying to debug/fix another aspect of it.

The whole code now looks like this:

(please note I changed "lame" to "c").

Now my concern is, I'm trying to optimize this script, but it doesn't seem to like it if I define "s" outside the functions, or if I add the visibility part to it. Any ideas? Or is this some kind of limitation I have to leave with?

This is what I would like, but it doesn't function:

siMKin

10:26 pm on May 9, 2006 (gmt 0)

it doesn't seem to like it if I define "s" outside the functions

i guess you mean "c"
Again, you need to remove the 'var' part, to make it global.

btw, could you indent your code a little when you post it. that makes it a lot more readable.

This is what I would like, but it doesn't function:

Same problem, you have to 'globally' define the variables by leaving out var

c=0; 
s=document.getElementById("s").style.visibility; 
function l() 
{ 
  if(s=="visible") 
  { 
   s="hidden"; 
   c--; 
  } 
  else 
  { 
   s="visible"; 
  } 
} 
document.onclick=function() 
{ 
  if(s=="visible") 
  { 
   if(c==1) 
   { 
    s="hidden"; 
    c--; 
   } 
   else 
   { 
    c++; 
   } 
  } 
}