PHPFixing
  • Privacy Policy
  • TOS
  • Ask Question
  • Contact Us
  • Home
  • PHP
  • Programming
  • SQL Injection
  • Web3.0

Monday, November 7, 2022

[FIXED] When i click on menu button it open menu but when i click close button its not closing it

 November 07, 2022     html, javascript, menu     No comments   

Issue

I was making a menu Button for a site , so when i click on menu , it change its innerhtml but when i click on close button its not changing its innerhtml.

Js code

function MENU() {
var MENUITEMS = document.getElementById('MENU')
MENUITEMS.innerHTML=" <a style='text-decoration:none;' href='OUR_WORKS.html'>OUR_WORKS</a><p class='LGND'>ABCD</p><button id='CLOSE'class='LGND' onclick='CLOSE()'>CLOSE_MENU</button>"
}
function CLOSE() {
var MENUITEMS = document.getElementById('MENU')
MENUITEMS.innerHTML="  <p onclick='MENU()' id='MENU'>MENU</p>"
}

Html code

 <p onclick="MENU()" id="MENU" 
 >MENU</p>

Solution

Every time you click on the container #MENU, it will show the menu. The problem is that even when the menu is open, clicking on #MENU will show the menu. So clicking the "close" button will close the menu, then open it again.

One way you could fix this is by storing the state of the menu in a variable - like this:

var OPEN = false,
  MENU_ELEM = document.getElementById("MENU");

function TOGGLEMENU(){
  if(OPEN){
    //menu is open, we need to close it
    OPEN = false;
    MENU_ELEM.innerHTML = "<p onclick='TOGGLEMENU()'>MENU</p>";
  } else {
    //menu is closed, we need to open it
    OPEN = true;
    MENU_ELEM.innerHTML =  "<a style='text-decoration:none;' href='OUR_WORKS.html'>OUR_WORKS</a><p class='LGND'>ABCD</p><button id='CLOSE'class='LGND' onclick='TOGGLEMENU()'>CLOSE_MENU</button>";
  }
}
<div id="MENU"><p onclick="TOGGLEMENU()">Menu</p></div>



Answered By - hman124
Answer Checked By - Dawn Plyler (PHPFixing Volunteer)
  • Share This:  
  •  Facebook
  •  Twitter
  •  Stumble
  •  Digg
Newer Post Older Post Home

0 Comments:

Post a Comment

Note: Only a member of this blog may post a comment.

Total Pageviews

Featured Post

Why Learn PHP Programming

Why Learn PHP Programming A widely-used open source scripting language PHP is one of the most popular programming languages in the world. It...

Subscribe To

Posts
Atom
Posts
Comments
Atom
Comments

Copyright © PHPFixing