javascript - the <ul> isn't collapsing , only extending -


the problem when press on <a>categories</a> <ul> extending when press again nothing

in css file have set display:none;

i have in php/html page

<html> <head> ... <script src="javascript/collapse.js"></script> ... </head>  <body>...<ul>    <a href="#" onclick="collapse('id1')">categories</a>    <ul id="id1">     <li>       <a href="#">business</a>     </li>     <li>       <a href="home.php">entertainment</a>     </li>     <li>       <a href="home.php">social media</a>     </li>     <li>       <a href="home.php">others</a>     </li>   </ul> </ul>...</html> 

and in collapse.js file

function collapse(id){     var e = document.getelementbyid(id);     if(e.style.display="block")         e.style.display="none";     if(e.style.display="none")         e.style.display="block"; }; 

i need use html,css , javascript , no others frameworks or libraries

first should use triple equals comparisions in javascript. second, should use else if statement, otherwise second if negate first one:

if(e.style.display === "block"){   e.style.display="none"; } else if (e.style.display === "none") {   e.style.display="block"; } 

Comments

Popular posts from this blog

node.js - Using Node without global install -

How to access a php class file from PHPFox framework into javascript code written in simple HTML file? -

java - Null response to php query in android, even though php works properly -