jquery 利用show和hidden实现级联菜单示例代码


Posted in Javascript onAugust 09, 2013
<%@ page language="java" contentType="text/html; charset=UTF-8" 
pageEncoding="UTF-8"%> 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
<title>jqueryMenu</title> 
<script type="text/javascript" src="js/jquery-1.10.2.js"></script> 
<script type="text/javascript"> 
$(document).ready(function(){ 
var allMenu=$("ul > a");//找到所有主菜单 
allMenu.click(function(){ 
var list=$(this).nextAll('li');//找到当前被点击a节点的所有li兄弟节点 
list.toggle('show'); 
}); 
}); 
</script> 
</head> 
<body> 
<ul><a href="#">菜单一</a> 
<li><a href="#">子菜单一</a></li> 
<li><a href="#">子菜单二</a></li> 
</ul> 
<ul><a href="#">菜单二</a> 
<li><a href="#">子菜单一</a></li> 
<li><a href="#">子菜单二</a></li> 
</ul> 
</body> 
</html>
Javascript 相关文章推荐
ExtJS 下拉多选框lovcombo
May 19 Javascript
关于js中alert弹出窗口文本换行问题简单详细说明
Dec 11 Javascript
javascript禁用Tab键脚本实例
Nov 22 Javascript
举例说明JavaScript中的实例对象与原型对象
Mar 11 Javascript
jQuery+CSS3实现仿花瓣网固定顶部位置带悬浮效果的导航菜单
Sep 21 Javascript
jQuery使用正则验证15/18身份证的方法示例
Apr 27 jQuery
详解Vue学习笔记进阶篇之列表过渡及其他
Jul 17 Javascript
AngularJs点击状态值改变背景色的实例
Dec 18 Javascript
vue 开发一个按钮组件的示例代码
Mar 27 Javascript
Vue-router的使用和出现空白页,路由对象属性详解
Sep 03 Javascript
angularJS1 url中携带参数的获取方法
Oct 09 Javascript
vue中的mvvm模式讲解
Jan 31 Javascript
jQuery :first选择器使用介绍
Aug 09 #Javascript
javascript读写XML实现广告轮换(兼容IE、FF)
Aug 09 #Javascript
jQuery prev ~ siblings选择器使用介绍
Aug 09 #Javascript
jQuery怎么解析Json字符串(Json格式/Json对象)
Aug 09 #Javascript
jQuery查询数据返回object和字符串影响原因是什么
Aug 09 #Javascript
在服务端(Page.Write)调用自定义的JS方法详解
Aug 09 #Javascript
Jquery显示、隐藏元素以及添加删除样式
Aug 09 #Javascript
You might like
PHP中的cookie不用刷新就生效的方法
2012/02/04 PHP
iis6+javascript Add an Extension File
2007/06/13 Javascript
JQuery触发radio或checkbox的change事件
2012/12/18 Javascript
JavaScript仿flash遮罩动画效果
2016/06/15 Javascript
JS常用函数和常用技巧小结
2016/10/15 Javascript
使用vue实现点击按钮滑出面板的实现代码
2017/01/10 Javascript
AngularJS ui-router (嵌套路由)实例
2017/03/10 Javascript
bootstrap table实现单击单元格可编辑功能
2017/03/28 Javascript
nodejs之get/post请求的几种方式小结
2017/07/26 NodeJs
BootStrap Fileinput上传插件使用实例代码
2017/07/28 Javascript
vue绑定设置属性的多种方式(5)
2017/08/16 Javascript
JavaScript实现计算多边形质心的方法示例
2018/01/31 Javascript
详解js加减乘除精确计算
2019/03/19 Javascript
vue+elementUI实现表单和图片上传及验证功能示例
2019/05/14 Javascript
微信小程序canvas动态时钟
2020/10/22 Javascript
[03:57]2016完美“圣”典风云人物:rOtk专访
2016/12/09 DOTA
9种python web 程序的部署方式小结
2014/06/30 Python
Python基础学习之常见的内建函数整理
2017/09/06 Python
LRUCache的实现原理及利用python实现的方法
2017/11/21 Python
Python实现定时精度可调节的定时器
2018/04/15 Python
Matplotlib中文乱码的3种解决方案
2018/11/15 Python
django session完成状态保持的方法
2018/11/27 Python
python如何以表格形式打印输出的方法示例
2019/06/21 Python
pandas计数 value_counts()的使用
2019/06/24 Python
介绍一款python类型检查工具pyright(推荐)
2019/07/03 Python
python实现图像检索的三种(直方图/OpenCV/哈希法)
2019/08/08 Python
Python多线程的退出控制实现
2020/08/10 Python
软件测试英文面试题
2012/10/14 面试题
办公室助理岗位职责
2013/12/25 职场文书
创先争优制度
2014/01/21 职场文书
医疗专业毕业生求职信
2014/08/28 职场文书
2015重阳节座谈会主持词
2015/07/30 职场文书
确保减税降费落地生根,用实实在在措施
2019/07/19 职场文书
经典法律座右铭(50句)
2019/08/15 职场文书
基于HTML十秒做出淘宝页面
2021/10/24 HTML / CSS
nginx配置限速限流基于内置模块
2022/05/02 Servers