javascript - Multiple buttons to show/hide div depending on current display -
brand-spanking-new javascript , trying implement part of school assessment site.
what i'm trying is, using multiple buttons, change display style of div. part i'm having trouble getting function either stay open (style.display = block) if different button pressed last, or close (style.display = none) if same button previous.
the reasoning behind next step implement ajax call different content div based on same buttons. trying basics there first. (learning exercise)
function toggle_visibility(caller) { var e = document.getelementbyid('hidden'); var current; if(caller == current){ e.style.display = 'none'; current = 'none'; }else{ e.style.display = 'block'; current = caller; }
that's script is, buttons calling above script different 'caller':
<button onclick="toggle_visibility('button1')">button1</button> <button onclick="toggle_visibility('button2')">button2</button> <button onclick="toggle_visibility('button3')">button3</button>
what doing wrong or missing? thanks.
the variable "current" scoped function toggle_visibility. each time button clicked , function invoked, "current" variable gets recreated.
you need move declaration "var current;" outside of function toggle_visibility.
when you're ready, read details: https://developer.mozilla.org/en-us/docs/web/javascript/reference/functions_and_function_scope
Comments
Post a Comment