<script>
window.onload = function()
{
//要折叠的区域
var catalog = document.getElementById("div-id");
//如果全部列表都添加折叠使用document.getElementsByTagName("ul");
var childs = catalog.getElementsByTagName("ul");
for (var i = 0; i < childs.length; i++)
{
var liList = childs[i].childNodes;
for (var j = 0; j < liList.length; j++)
{
if (liList[j].tagName == "LI")
{
addEvent(liList[j]);
}
}
}
}
function addEvent(o)
{
var as = o.getElementsByTagName("a");
as[0].onclick = function(e)
{
var theEvent = window.event || e;
var link = theEvent.srcElement ? theEvent.srcElement : theEvent.target;
var uls = link.parentNode.childNodes;
for (var i = 0;i < uls.length;i++)
{
if (uls[i].tagName == "UL")
{
if (uls[i].style.display == "none")
{
uls[i].style.display = "block";
}
else
{
uls[i].style.display = "none";
}
}
}
}
}

以上是javascript简单的对列表实现点击展开折叠功能

javascript实现列表的点击展开折叠的更多相关文章

  1. listview嵌套gridview,并实现grid元素部分显示以及点击展开与折叠

    原文链接:http://blog.csdn.net/duguju/article/details/49538341 有时我们需要用GridView显示目录列表,有时甚至是二级的,即listview每一 ...

  2. jquery实现点击展开列表同时隐藏其他列表 js 对象操作 对象原型操作 把一个对象A赋值给另一个对象B 并且对象B 修改 不会影响 A对象

    这篇文章主要介绍了jquery实现点击展开列表同时隐藏其他列表的方法,涉及jquery鼠标事件及节点的遍历与属性操作技巧,具有一定参考借鉴价值,需要的朋友可以参考下 本文实例讲述了jquery实现点击 ...

  3. JS点击查看更多内容 控制段落文字展开折叠

    JavaScript+jQuery实现的文字展开折叠效果,点击文字后文字内容会完整的显示出来,控制段落来显示文字,不需要的时候,可以再次点击后将内容折叠起来,也就是隐藏了一部分内容.点击查看更多的功能 ...

  4. 【转】 HVTableView创建--展开/折叠列表能 AAShareBubbles社会分享动画组

    原文: http://blog.csdn.net/billfanggs/article/details/17279969 HVTableView HVTableView是UITableView(带有展 ...

  5. iOS实现类似QQ的好友列表,自由展开折叠(在原来TableView的基础上添加一个字典,一个Button)

    //直接代码 只包含 折叠展开字典的处理搭建#import "CFViewController.h" @interface CFViewController ()<UITab ...

  6. android 模仿大众点评团购卷列表多余3条时折叠,点击时显示剩余全部的功能

    要实现这样一个效果:加载一组数据,当这组数据的条数超过2条时,则这显示两条,其余的隐藏,当点击“展开全部时”在显示余下的部分.效果如下图所示: 展开前的效果: 展开后的效果 : 实现思路:控制数据而不 ...

  7. jquery 展开折叠菜单

    jquery 展开折叠菜单 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <ht ...

  8. jquery垂直展开折叠手风琴二级菜单

    摘要:jquery实现垂直展开二级菜单 最近新开发一个简单项目,用到左侧两级的菜单.找找了手头的文件,竟然没有现成的代码,算了,去网上找找整理下吧. 注:jquery-1.8.3.min.js需要下载 ...

  9. js 控制展开折叠 div html dom

    js 控制展开折叠 div    html dom <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" ...

随机推荐

  1. JAVA中用堆和栈的概念来理解equals() "=="和hashcode()

    在学习java基本数据类型和复杂数据类型的时候,特别是equals()"=="和hashcode()部分时,不是很懂,也停留了很长时间,最后终于有点眉目了. 要理解equals() ...

  2. tomcat源码分析(三)一次http请求的旅行-从Socket说起

    p { margin-bottom: 0.25cm; line-height: 120% } tomcat源码分析(三)一次http请求的旅行 在http请求旅行之前,我们先来准备下我们所需要的工具. ...

  3. php封装微信SDK

    <?phpclass JSSDK { private $appId = '你公众号的appid'; private $appSecret = '你公众号的appSecret'; public f ...

  4. JQuery下focus()无法自动获取焦点的处理方法 jquery如何使文本框获得焦点

    今天遇见这么一个小小的问题,就是文本框中需要输入内容才可以提交,如果没有输入就提示并使该文本框获得焦点! 这么一个简单的事情如果没有使用 jQuery的话 是不是对象.focus()就可以了, Jav ...

  5. ElasticSearch5+logstash的logstash-input-jdbc实现mysql数据同步

    在实现的路上遇到了各种坑,再次验证官方文档只能产考不能全信! ElasticSearch安装就不说了上一篇有说! 安装logstash 官方:https://www.elastic.co/guide/ ...

  6. FlexSlider jQuery滑动切换插件 参数

    demo:http://www.sucaihuo.com/jquery/0/6/demo/ FlexSlider是一个非常出色的jQuery滑动切换插件,它支持所有主流浏览器,并有淡入淡出效果.适合所 ...

  7. MVC使用Membership配置

    MVC的权限管理,环境是MVC4.5,SQL Server2008 修改前 Web.config文件: <system.web> <authentication mode=" ...

  8. EasyUI 的Tab 标签添加右键菜单

    样式: 主要提供右键功能代码. (只需要提供你需要的js和css就行了) <!doctype html> <html> <head> <base href=& ...

  9. JSON,Bean,XML,List,Map

    http://blog.csdn.net/superit401/article/details/51728929 JSON-lib这个Java类包用于把bean,map和XML转换成JSON并能够把J ...

  10. git pull 然后 ahead of origin/master * commit 消失

    本来显示 your branch is ahead origin/master * commit后来也许在master merge 这个分支后, 然后git pull, 就显示Your branch ...