<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. fenxi

    线路:通过定义而来(固定线路可以定义,随机和临时线路怎么来) 订单:线路上点对点的关系 装车单:同意线路上的车辆可以有多个订单组成的装车单 车辆任务:给调度接口输入车辆和订单集合,根据订单产生多个车的 ...

  2. Chapter 1: 随机事件及其概率

    1. 随机试验,样本点,样本空间 若试验具有下列特点: 在相同条件下可重复进行 每次试验的可能结果不止一个,且所有可能结果在实验前是已知的 实验前不能确定哪一个结果会发生 则称该试验为随机试验,常记为 ...

  3. 20-ES6(3)class基本语法

    # Class基本语法 关于es6的class简介: ES6提供了更接近传统语言的写法,引入了Class(类)这个概念,作为对象的模板.通过class关键字,可以定义类.基本上,ES6的class可以 ...

  4. PHP调用webservice遇到 Soap WSDL Error - "failed to load external entity

    本人遇到的原因是服务器上没有安装php-soap centos安装方式: yum install php-soap 安装完成后重启 php-fpm 服务 service php-fpm restart ...

  5. 【leetcode❤python】 6. ZigZag Conversion

    #-*- coding: UTF-8 -*- #ZigZag Conversion :之字型class Solution(object):    def convert(self, s, numRow ...

  6. destoon系统中get_maincat的用法及解释

    get_maincat函数的用法, 如get_maincat(0, $mid, 1),其中第一.二.三个参数分别表示什么? 第一个参数代表parentid 第二个参数代表所有的分类 第三个参数 代表 ...

  7. 集群节点间网络通信TIPC

    1. TIPC背景介绍 TIPC主要是用于集群网络环境之中,它这个协议有一些前提假设包括: 协议发送的大部分message都是直接到达目的地(无路由): message的传输时间都很短; messag ...

  8. JS中parseInt()、Numer()深度解析

    JS中字符串转换为数字有两种方式: 1.parseInt函数 定义:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/ ...

  9. 如何自定义ReportDesigner的向导界面(WIN)

    https://www.devexpress.com/Support/Center/Example/Details/T140683

  10. moq 的常用使用方法

    测试方法                             Console.WriteLine(mock.Object.GetCountThing()); 匹配参数   mock.Setup(x ...