Global variable not updating in javascript

Question

I've seen several posts on here about how to update a Javascript global variable. I'm trying to use it as a toggle, so that when the function runs again it does the opposite of what it just did (or, that is, whatever I've set it to do. )

It's not working, and I'm frusturated because I'm getting no errors from the developer console, either.

var display_menu_toggle = false;
function display_menu() {
        if (display_menu_toggle == true) {
        document.getElementById('barometer').style.display = "none";
        document.getElementById('finance').style.display = "none";
        return false;
    }
    document.getElementById('barometer').style.display = "block";
    document.getElementById('finance').style.display = "block";
    display_menu_toggle = true;
    return true;
}

You are never setting display_menu_toggle back to false. — Felix Kling
– Felix Kling, Commented Jan 17, 2015 at 7:54
Instead of display_menu_toggle = true; you need to toggle it display_menu_toggle = !display_menu_toggle; — techfoobar
– techfoobar, Commented Jan 17, 2015 at 7:54
What about it is not working? It looks like it should toggle the first time (false to true), but not necessarily to false again. — Beartums
– Beartums, Commented Jan 17, 2015 at 7:54
@felixKling Thanks! It works. Now, if you want the points you're gonna have to submit it in terms of an answer. — ilarsona
– ilarsona, Commented Jan 17, 2015 at 7:59
first of all you don't need to use if (display_menu_toggle == true) you could simply write if (display_menu_toggle). Secondly you should assign a false value to display_menu_toggle when you are done with it. — ilgaar
– ilgaar, Commented Jan 17, 2015 at 8:55

RobG · Accepted Answer · 2015-01-17 08:01:10Z

1

As others have said, you aren't changing the value of display_menu_toggle for both conditions. Consider:

var display_menu_toggle = false;

function display_menu() {
    document.getElementById('barometer').style.display = display_menu_toggle? "none" : '';
    document.getElementById('finance').style.display = display_menu_toggle? "none" : '';
    display_menu_toggle = !display_menu_toggle;
}

It's usually best to toggle style.display between none and '' (empty string) so that when not hidden, the element returns to its default or inherited style, whatever that might be.

answered Jan 17, 2015 at 8:01

RobG

148k32 gold badges180 silver badges216 bronze badges

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

Collectives™ on Stack Overflow

Global variable not updating in javascript

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related