`
keimon
  • 浏览: 74850 次
  • 性别: Icon_minigender_2
  • 来自: 上海
社区版块
存档分类
最新评论

简单三级目录

jquery 
阅读更多

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<script type="text/javascript" src="jquery-1.8.3.js"></script>
<style>
ul{
  list-style:none;
  padding:0;
  margin:0;
}
#hid1, #ul1, #ul2{
  display:none;
}
#hid1{
  padding-left:20px;
}
#ul1, #ul2{
  padding-left:20px;
}
</style>
</head>

<body>
<div id="out">
    <span onclick="hideOrShow('hid1')">汽车</span>
    <div id="hid1">
    <div onclick="hideOrShow('ul1')">欧美车</div>
    <ul id="ul1">
      <li>福特</li>
      <li>奥迪</li>
      <li>宾利</li>
    </ul>
    <div onclick="hideOrShow('ul2')">欧美车</div>
    <ul id="ul2">
   <li>福特</li>
   <li>奥迪</li>
   <li>宾利</li>
    </ul>
 </div>
</div>
<script>
   function hideOrShow(hid){
      if($('#'+hid).is(':hidden')){
      $('#'+hid).show();
   }else{
      $('#'+hid).hide();
   }
   }
</script>
</body>
</html>

分享到：
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    三级教育目录1.zip

    【描述】"三级教育目录1"可能是对压缩包内文档的简单概括，暗示了这个文档集合是关于三级教育的目录或者大纲，可能列出了各个级别教育的分类、科目、教学资源以及相关活动的概述。它旨在为教育工作者、学生或政策...

    C语言教程-谭浩强.CHM 精排版带三级目录代码美化

    C语言教程-谭浩强.CHM 精排版 带三级目录 代码美化，去除了Turbo C部分内容。所有代码经过美化排版，三级目录便于浏览查找。Onestab出品。 目前所能找到的最小、最轻量级版本。仅 282KB大小。 目录样例：1 C语言概述...

    文件年月日三级目录.zip

    标题中的“文件年月日三级目录.zip”表明这个压缩包包含了一个程序，该程序能够将文件根据它们的最后修改时间自动生成一个结构化的存储路径，这个路径由年、月、日这三级目录构成。这样的设计有助于管理和查找大量...

    HTML 三级页面

    关于“三个网页”的概念，通常这意味着一个简单的网站结构，包括首页、二级页面和可能的三级页面。首页通常介绍网站内容并提供导航链接，二级页面可以包含更具体的信息，而三级页面则可能进一步细化这些信息。在实际...

    jquery easyui 三级菜单导航

    `jQuery EasyUI` 是一个基于 jQuery 的轻量级框架，它提供了丰富的组件和样式，简化了前端开发工作，包括创建复杂的界面如三级菜单导航。本文将深入探讨如何使用 `jQuery EasyUI` 实现这样的功能。 首先，我们要...

    iOS 三级列表

    在iOS开发中，三级列表（也称为多级导航或树形结构）是一种常见的用户界面设计，用于展示层次分明的数据，例如目录、菜单或者层级关系的内容。这种设计允许用户逐级探索深层次的信息，使得复杂的结构变得易于理解和...

    手机二三级导航，手机导航，响应式导航，自适应导航，下拉导航

    手机二三级导航，手机导航，响应式导航，自适应导航以及下拉导航都是为了优化用户在小屏幕设备上的浏览体验。下面我们将深入探讨这些概念，并结合文件`mob.html`, `css`, `images`, `img`, `js`来理解它们在实际开发...

    二级目录文件系统设计代码

    ### 二级目录文件系统设计代码解析 #### 一、概览 本文档旨在解析一个基于C++语言编写的二级目录文件系统设计代码。该系统利用Visual Studio 2010开发环境实现，提供了多种基本的文件操作命令，包括用户登录、文件...

    省市区三级联动（代码+SQL）

    标题中的“省市区三级联动（代码+SQL）”是指在软件开发中常见的一个功能模块，特别是在中国的地理信息处理中，为了实现用户选择所在省份、城市和区县的联动效果。这个功能常见于地址输入、配送范围设定等场景。在这...

    javascript css实现三级目录(简单的)

    本篇文章主要介绍了javascript css实现三级目录(简单的)，这是一款不错的CSS树形菜单，树状列表，当然不全是CSS实现，部分功能还使用了JavaScript代码进行配合，感兴趣的小伙伴们可以参考一下

    SSM+Maven实现无刷新三级联动

    SSM+Maven实现无刷新三级联动是一种常见的前端与后端交互技术，广泛应用于Web开发中，例如在选择地址、分类等场景。SSM是指Spring、SpringMVC和MyBatis三大框架的组合，Maven则是一个项目管理工具。本项目通过这四个...

    三级联动滚动效果

    "city（三级联动经典-平面）"可能是这个压缩包中的主要文件或目录，它可能包含了一个示例项目的源代码、CSS样式文件、JavaScript脚本或者相关的图片资源。这个项目可能是一个经典的实现三级联动滚动效果的实例，...

    模拟实现采用二级目录结构的磁盘文件系统中的文件操作

    #### 一、二级目录结构及其作用 **定义与组成：** 在计算机科学领域，二级目录结构是一种高效的文件管理系统，通过在主文件目录(Master File Directory, MFD)下构建多个用户文件目录(User File Directory, UFD)，...

    LCD多级菜单程序

    每一级菜单都可以看作是一个节点，包含标题、操作选项以及指向子菜单的指针。当用户选择一个菜单项时，程序会更新LCD显示，进入相应的子菜单或者执行相应操作。 在实际编程过程中，我们可能使用C语言或者其他嵌入式...

    jQuery商品发布三级联动菜单代码.zip

    《jQuery商品发布三级联动菜单代码详解》 在Web开发中，联动菜单是一种常见的交互设计，它通常用于导航或数据选择，特别是在商品发布系统中。这种菜单可以实现父级选项变化时，子级选项自动更新的效果，提升用户...

    列表三级展开

    在IT领域，特别是前端开发中，列表的三级展开是一个常见的需求，主要用于构建具有层次结构的数据展示，例如导航菜单、文件目录或树形结构的数据。这种功能使得用户能够方便地查看和操作多级嵌套的数据。在本文中，...

    ios三级展开列表

    在iOS开发中，三级展开列表通常用于展示层级结构的数据，比如目录树、组织架构或导航菜单。这种列表能够帮助用户逐步探索复杂的信息，提供良好的用户体验。`TQMultistageTableView`是一个开源库，专门用于实现这样的...

    jquery展开收缩三级下拉菜单导航代码

    本篇将深入讲解如何使用jQuery实现一个可展开收缩的三级下拉菜单导航。 jQuery是一个轻量级、高性能的JavaScript库，它简化了HTML文档遍历、事件处理、动画以及Ajax交互。在这个项目中，jQuery将帮助我们实现动态...

    ajax+json+ashx实现下拉列表三级联动.rar

    在IT领域，尤其是在Web开发中，下拉列表的三级联动是一种常见的交互设计，它能够帮助用户在多个选项间快速导航并作出选择。本项目“ajax+json+ashx实现下拉列表三级联动”旨在利用jQuery、Ajax以及ASHX处理程序来...

Magicbox
Global site tag (gtag.js) - Google Analytics