JS variable setting inside jQuery click function

Question

I'm having trouble with setting variables for some opening and closing menus. I need to have a variable I can query as I have other click functions going on that will open and close different menus, so I can't use a toggle.

I don't understand why the following code does not work. Please could someone advise as I can't quite get it, I understand variable scope, but I think the way the jQuery does the click function is confusing me. Or perhaps there is a better pattern to follow for this kind of functionality..

var opentags = false;

$('a#tags').click(function () {

    if (opentags == true) {
            $('nav#tags').slideUp(); 
            // and other stuff
            var opentags = false;
    } else {
            $('nav#tags').slideDown();
            // and other other stuff 
            var opentags = true;
    }});

Thanks in advance.

Pointy · Accepted Answer · 2012-03-14 16:16:58Z

2

You're redeclaring a new local variable in the function because of the var keyword. Get rid of that.

Also, there's no reason to compare boolean variables to the boolean constants:

  if (opentags) {
    $('#tags').slideUp();
    opentags = false;
  }
  else {
    $('#tags').slideDown();
    opentags = true;
  }

Note also that you don't need the "nav" in the selectors; "id" values should be unique on the page anyway.

Using var is a really important thing in general, of course, so don't get the idea that it's a bad thing. It's just that in this case you want to access the variable declared outside the function scope.

answered Mar 14, 2012 at 16:16

Pointy

415k62 gold badges600 silver badges631 bronze badges

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

1 Comment

iiz Over a year ago

I never used to use var to declare but recently started, now I fully understand. Thanks.

SLaks · Accepted Answer · 2012-03-14 16:17:25Z

0

var opentags creates a new local variable, which only lives inside that callback.
You want to set the existing global variable.

answered Mar 14, 2012 at 16:17

SLaks

891k182 gold badges1.9k silver badges2k bronze badges

Collectives™ on Stack Overflow

JS variable setting inside jQuery click function

2 Answers 2

1 Comment

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Related