在网上看了好多用Javascript实现菜单折叠的例子都特别的麻烦，于是自己写了一个虽然效果不如网上的强但是也可以实现了相应的功能：
functiondisplay(num)
{
if(menu_left[num].style.display=="none")
{
for(a=0;a<menu_left.length;a++){
if(a==num){
menu_left[a].style.display="inline";
}
else{
menu_left[a].style.display="none";
}
}
}
else{
menu_left[num].style.display="none";
}
}
<!DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.01//EN""http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/>
<linkrel="stylesheet"type="text/css"href="../../css.css">
<scriptlanguage="javascript"src="hide.js"></script>
</head>
<body>
<divclass="menu_left">
<ul>
<li>
<ahref="javascript:display(0)">号码信息维护管理</a>
<divid="menu_left"style="display:none">
<ul>
<li>
<ahref="information_select.html"target="right">查询号码信息</a>
</li>
<li>
<ahref="information_batchupdata.html"target="right">状态批量修改页面</a>
</li>
<li>
<ahref="loginformation_select.html"target="right">日志查询页面</a>
</li>
</ul>
</div>
</li>
<li>
<ahref="javascript:display(1)">号码回收</a>
<divid="menu_left"style="display:none">
<ul>
<li>
<ahref="recovery/numbers_list_recovery.html"target="right">待回收号码清单</a>
</li>
<li>
<ahref="recovery/numbers_statistics_recovery.html"target="right">待回收号码详情统计</a>
</li>
</ul>
</div>
</li>
<li>
<ahref="restart/options.html"target="right">回收号码启用</a>
</li>
</ul>
</div>
<divclass="right">
<iframeclass="rightIframe"src="information_select.html"name="right"frameborder="0"scrolling="no"width="100%"onload="this.height=0;varfdh=(this.Document?this.Document.body.scrollHeight:this.contentDocument.body.offsetHeight);this.height=(fdh>7?fdh:7)"allowtransparency="false">
</iframe>
</div>
</body>
</html>
这样就实现了菜单的折叠效果了，是不是觉得很简单啊。
还有一点要注意在引入脚本的时候<script></script>要这样写全，要不然会出不来页面。
分享到：
相关推荐
例如，jQuery的`slideToggle()`函数可以轻松实现菜单的滑动展开和折叠效果。 在实际项目中，我们需要考虑浏览器兼容性问题，因为不是所有用户都使用最新的浏览器。因此，可能需要引入polyfill库，或者使用渐进增强...
另外，为了照顾不支持JavaScript的用户或搜索引擎，还可以使用CSS和HTML5的`<details>`和`<summary>`元素来提供基本的折叠菜单功能，然后用JavaScript增强交互性。 总的来说，"简单的Javascript折叠菜单"是一个实用...
在本文中，我们将深入探讨JavaScript可折叠菜单的设计与实现，以及它如何提升网页的可操作性和易用性。 首先，我们需要了解JavaScript的基本概念。JavaScript是一种客户端脚本语言，它允许我们动态地改变HTML内容和...
本文将深入探讨如何使用JavaScript实现折叠式菜单，并提供一个简单的示例。 折叠式菜单通常用于组织大量导航选项，以便用户可以轻松地查看和访问相关内容。这种菜单在页面加载时默认隐藏部分子菜单，只有当用户点击...
在本案例中，"js折叠菜单效果"指的是使用JavaScript实现的一种用户界面功能，允许菜单项在点击时展开或收起，以此节省空间并提高用户体验。 折叠菜单在网站导航中十分常见，尤其是在移动设备上，因为它们能够有效地...
本文将深入探讨如何使用JavaScript创建树形菜单、仿QQ菜单以及折叠式菜单。 树形菜单通常用于展示层级结构的数据，比如网站的导航或文件系统。在JavaScript中，我们可以利用数组和递归函数来构建这样的结构。每个...
在这个函数中，我们可以改变子菜单的CSS样式，如`display`属性，来实现折叠效果。 然而，jQuery使得这个过程更加简便。jQuery的`click()`方法可以达到同样的效果，并且它还提供了一整套方法来操作DOM元素，如`...
对于更高级的折叠效果，可以使用JavaScript库如jQuery提供的一些动画方法，或者使用CSS3的`animation`属性来增加过渡效果，使菜单展开和折叠更加平滑。 5. 兼容性和响应式设计： 考虑到不同设备和浏览器的兼容性...
JavaScript会通过操作这些元素的`class`或`style`属性来实现折叠效果。 3. **tree.js**： 这是整个项目的核心，实现了树型目录菜单的交互逻辑。JavaScript代码可能会监听用户点击事件，当用户点击某个节点的折叠...
最后，“OICQ菜单效果”可能指的是模仿即时通讯软件OICQ（现称QQ）的下拉菜单样式，这类菜单通常具有快速操作和反馈的特点，可以使用JavaScript实现点击后显示快捷选项。 以上各种JavaScript菜单特效都是通过结合...
4. **过渡和动画**：使用`transition`和`animation`属性，为菜单项添加平滑的过渡效果，如悬停时的放大、淡入淡出等，提升用户交互体验。 接下来，JavaScript是用于实现菜单动态行为的关键。JavaScript可以： 1. *...
Accordion 菜单折叠效果控件是一种常见的网页交互设计元素，尤其在内容丰富的网站和应用中，它能够有效地节省空间并提升用户体验。该控件基于AJAX（Asynchronous JavaScript and XML）技术，允许页面的部分内容在...
这可能涉及到更复杂的JavaScript实现，如使用`requestAnimationFrame`来实现缓冲动画，以及处理不同层级菜单间的相互影响。 在实际开发中，我们还需要考虑无障碍性（accessibility），确保屏幕阅读器和其他辅助技术...
3. **JavaScript/jQuery交互**：当用户点击菜单项时，JavaScript函数会被调用，修改菜单项的样式或类，以实现展开和折叠的效果。可以使用`addClass()`和`removeClass()`方法添加或移除表示展开/折叠状态的CSS类。 4...
简单易用的折叠菜单,支持多级,HTML行内无脚本
通过JavaScript实现树形菜单，可以有效地展示这些层次关系，并提供方便的展开、折叠、选择等功能。 实现JavaScript树形菜单主要涉及以下几个关键技术点： 1. 数据结构设计：首先，我们需要定义一个数据结构来存储...
JavaScript菜单的优势在于它们可以动态响应用户的操作，如悬停、点击等，提供更丰富的视觉反馈和交互效果。这些样式各异的菜单可以帮助开发者根据网站的主题和设计风格选择最适合的样式，从而提升整体的视觉吸引力。...
在实现右侧滑动折叠效果导航菜单时，jQuery提供了方便的API来处理这些任务。例如，`slideUp()`和`slideDown()`方法用于创建平滑的滑动动画，`toggleClass()`用于切换类名，进而改变元素的显示状态。 二、CSS样式...
3. **JavaScript事件处理**：使用JavaScript监听菜单项的点击事件，当事件触发时，用JavaScript函数来处理折叠或展开操作。这可能涉及到修改元素的`style.display`属性，或者添加/删除CSS类以切换可见性。 4. **...