javascript下拉列表菜单的实现方法_javascript技巧

之前写过这个《javascript下拉列表中显示树形菜单的实现方法》菜单的体现，但是在写了之后就发现了，不太适合，高度要精准控制，并且还不是很好看。现在采用table来封装，我们知道table的每一行写满了之后，下一行会自动加，这个比之前我们自己制定高度好很多。
1、点击之后都可以并存的情况（只需函数写法不一样就可）
dispaly也是自己设置的，通过父节点来操作子节点，显示与否；

/* function open1(node){ 
   
   //通过父节点来操作兄弟节点 
    
   当点击之后出现之后，直接就能打开但是要求在点开一个时候，其余的都关掉 
 
    var nodes = node.parentNode; 
    var nn = nodes.getElementsByTagName("ul")[0]; 
    with (nn.style) { 
     display = (display == "block") ? "none" : "block"; 
    } 
   }*/ 
    

2、点击之后只允许打开一个，其余的都要关掉

css样式的编写：

效果图（只能开一个的）：

完整代码：

同事栏

• 同事1
• 同事2
• 同事3
• 同事4

同学栏

• 同学1
• 同学2
• 同学3
• 同学4

黑名单栏

• 黑名单同学1
• 黑名单同学2
• 黑名单同学3
• 黑名单同学4

相信大家通过这两篇文章的介绍应该有了大概的思路，小编的这篇文章有些制作的效果略微简陋，大家可以再进一步的完善。