Jquery中菜单的展开和折叠
jquery内容
<script>
$(function () {
$("dl dt").click(function () {
$(this).siblings().toggle().parent().siblings().children("dd").hide();
});
});
</script>
标签内容
<dl id="ctl00_menuPassMgr">
<dt><span>
<img alt="" src='images/ico03.gif' /></span> <span><a href="javascript:">密码管理</a></span>
</dt>
<dd>
<span>
<img alt="" src='images/ico06.gif' /></span> <span><a href='/SysManager/ChangePassword.aspx'>
修改密码</a></span>
</dd>
</dl>
<dl id="ctl00_menuHourse">
<dt><span>
<img alt="" src='images/ico03.gif' /></span> <span><a href="javascript:">宿舍管理</a></span>
</dt>
<dd>
<span>
<img alt="" src='images/ico06.gif' /></span> <span><a href='/SchoolHourseManager/SchoolHourseList.aspx'>
学生宿舍查询</a></span>
</dd>
<dd>
<span>
<img alt="" src='images/ico06.gif' /></span> <span><a href='/SchoolHourseManager/SchoolHourseEdit.aspx'>
学生宿舍新增</a></span>
</dd>
<dd>
<span>
<img alt="" src='images/ico06.gif' /></span> <span><a href='/SchoolHourseManager/CheckStudentDormitory.aspx'>
学生宿舍分配</a></span>
</dd>
</dl>
<dl id="ctl00_menuStudent">
<dt><span>
<img alt="" src='images/ico03.gif' /></span> <span><a href="javascript:">学生管理</a></span>
</dt>
<dd>
<span>
<img alt="" src='images/ico06.gif' /></span> <span><a href='/StudentManager/StudentList.aspx'>
学生信息列表</a></span>
</dd>
<dd>
<span>
<img alt="" src='images/ico06.gif' /></span> <span><a href='/StudentManager/StudentEdit.aspx'>
学生信息新增</a></span>
</dd>
<dd>
<span>
<img alt="" src='images/ico06.gif' /></span> <span><a href='/ClassManager/ClassList.aspx'>
班级信息列表</a></span>
</dd>
<dd>
<span>
<img alt="" src='images/ico06.gif' /></span> <span><a href='/ClassManager/ClassEdit.aspx'>
班级信息新增</a></span>
</dd>
</dl>
<dl id="ctl00_menuTeacher">
<dt><span>
<img alt="" src='images/ico03.gif' /></span> <span><a href="javascript:">教师管理</a></span>
</dt>
<dd>
<span>
<img alt="" src='images/ico06.gif' /></span> <span><a href='/TeacherManager/TeacherEdit.aspx'>
教师入职登记</a></span>
</dd>
<dd>
<span>
<img alt="" src='images/ico06.gif' /></span> <span><a href='/TeacherManager/TeacherList.aspx'>
教师信息查询</a></span>
</dd>
</dl>
<dl id="ctl00_menuReport">
<dt><span>
<img alt="" src='images/ico03.gif' /></span> <span><a href="javascript:">缴费及统计报表</a></span>
</dt>
<dd>
<span>
<img alt="" src='images/ico06.gif' /></span> <span><a href='/TeacherManager/TeacherList.aspx'>
学生缴费入口</a></span>
</dd>
<dd>
<span>
<img alt="" src='images/ico06.gif' /></span> <span><a href='/TeacherManager/TeacherList.aspx'>
学生缴费查询</a></span>
</dd>
<dd>
<span>
<img alt="" src='images/ico06.gif' /></span> <span><a href='/TeacherManager/TeacherList.aspx'>
收件信息查看</a></span>
</dd>
<dd>
<span>
<img alt="" src='images/ico06.gif' /></span> <span><a href='/TeacherManager/TeacherList.aspx'>
发件信息查看</a></span>
</dd>
</dl>
Jquery中菜单的展开和折叠的更多相关文章
- element-ui 框架中使用 NavMenu 导航菜单组件时,点击一个子菜单会出现多个子菜单同时展开或折叠?
我在使用 elment-ui 框架的导航组件时,直接粘贴复制了官网上 (http://element-ui.cn/#/zh-CN/component/menu)的例子不会出错,但是当我将他们转化为动态 ...
- 使用jQuery 中的显示与隐藏动画效果实现折叠下拉菜单的收缩和展开,在页面的列表中有若干项,列表的每项中有一个二级列表,二级列表默认为隐藏状态。点击列表的项,切换二级列表的显示或隐藏状态
查看本章节 查看作业目录 需求说明: 使用jQuery 中的显示与隐藏动画效果实现折叠下拉菜单的收缩和展开,在页面的列表中有若干项,列表的每项中有一个二级列表,二级列表默认为隐藏状态.点击列表的项,切 ...
- jQuery&HTML&CSS3实现垂直手风琴折叠菜单方法讲解
在网页制作中我们常常需要折叠式的菜单,在折叠菜单中,手风琴特效的菜单是非常受欢迎,下面就讲解使用jQuery+HTML+CSS3实现垂直手风琴折叠菜单的方法. jQuery实现垂直手风琴折叠菜单示例代 ...
- jQuery文本段落展开和折叠效果
<!DOCTYPE html> <head> <meta http-equiv="Content-Type" content="text/h ...
- jquery实现菜单功能(单击展开或者关闭)-一般应用于后台
<!doctype html> <html> <head> <meta charset="gb2312"> <title> ...
- JQuery EasyUI treegrid展开与折叠,以及数据加载两次的问题
问题:做项目的时候遇到代码生成的页面,只默认展开了一级节点,每次操作之后刷新还要手动一级一级展开,太麻烦了 官方API:http://www.jeasyui.net/plugins/186.html ...
- jQuery 文本段落展开和折叠效果
jQuery 文本段落展开和折叠效果 <!DOCTYPE html> <head> <meta http-equiv="Content-Type" c ...
- 在 jQuery 中使用滑入滑出动画效果,实现二级下拉导航菜单的显示与隐藏效果
查看本章节 查看作业目录 需求说明: 在 jQuery 中使用滑入滑出动画效果,实现二级下拉导航菜单的显示与隐藏效果 用户将光标移动到"最新动态页"或"帮助查询" ...
- jquery实现点击展开列表同时隐藏其他列表 js 对象操作 对象原型操作 把一个对象A赋值给另一个对象B 并且对象B 修改 不会影响 A对象
这篇文章主要介绍了jquery实现点击展开列表同时隐藏其他列表的方法,涉及jquery鼠标事件及节点的遍历与属性操作技巧,具有一定参考借鉴价值,需要的朋友可以参考下 本文实例讲述了jquery实现点击 ...
随机推荐
- Tesseract-OCR-02-Tesseract-OCR 的安装与 环境变量配置
Windows 下 Tesseract-OCR 的安装与 环境变量配置 本篇介绍Windows下Tesseract-OCR的安装与环境配置,然后做一个图片的文字识别测试 Windows下 Tesser ...
- YoLo 实践(1)
目录 YoLo 实践(1) 目标: 实施方法: Step 0. 测试项目是否可以正常运行 运行效果图 使用VOC数据结构训练模型 Step1: 生成统一格式的标注文件和类别文件 Step2: 加载预训 ...
- SQL删除多列语句的写法
SQL删除表中多个列的写法: ALTER TABLE table_name DROP COLUMN COLUMN1,COLUMN COLUMN2,COLUMN COLUMN3 ……
- 你所不知道的C和C++运行库 标签: vc 2017-05-26 10:33 41人阅读 评论(0) 收藏
在使用vs2013调用vc2005编译出的dll时出现错误,遂将源程序用vs2013编译出dll,再用vs2013调用错误消失,不解.寻找原因时有人说"VC库版本不一样",故查找C ...
- The Tao to Excellent
1:一次只做一件事情 我不具备同时做好多件事情的能力. 2:随身携带一本书 效率最高的学习时间是那些零碎的时间. 3:听身体的 休息的标准是:如果你觉得你是在休息,那你就是在休息了. 4:如果有一件事 ...
- Centos7 yum安装mysql
参考此文档:http://www.jb51.net/article/116032.htm http://www.jb51.net/article/95399.htm 1.在官网下载mysql57-co ...
- mongo数据库基础语法
http://www.runoob.com/mongodb/mongodb-create-collection.html 很详细
- Nodejs与mysql连接池的应用(pool)
/* * 连接池 连接和缓存的技术 * */ var mysql = require('mysql'); var pool = mysql.createPool({ connectionLimit:2 ...
- Advanced Plugin Concepts
Provide Public Access to Default Plugin Settings An improvement we can, and should, make to the code ...
- iis服务器php环境 failed to open stream: No such file or directory解决办法
项目主机用的windows系统,iis服务器:远程连接桌面—>本地资源->映射D盘驱动器,将本地d盘修改后的文件放在远程主机项目目录里,访问报出failed to open stream: ...