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 相关文章推荐
javascript 面向对象,实现namespace,class,继承,重载
Oct 29 Javascript
JavaScript中yield实用简洁实现方式
Jun 12 Javascript
用显卡加速,轻松把笔记本打造成取暖器的办法!
Apr 17 Javascript
JQuery中SetTimeOut传参问题探讨
May 10 Javascript
9款2014最热门jQuery实用特效推荐
Dec 07 Javascript
vue.js入门教程之绑定class和style样式
Sep 02 Javascript
写jQuery插件时的注意点
Feb 20 Javascript
JS仿Base.js实现的继承示例
Apr 07 Javascript
jQuery模拟爆炸倒计时功能实例代码
Aug 21 jQuery
JavaScript简单实现合并两个Json对象的方法示例
Oct 16 Javascript
微信{"errcode":48001,"errmsg":"api unauthorized, hints: [ req_id: 1QoCla0699ns81 ]"}
Oct 12 Javascript
vue-cli4.5.x快速搭建项目
May 30 Vue.js
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 setTime 设置当前时间的代码
2012/08/27 PHP
php cookie 详解使用实例
2016/11/03 PHP
PHP+MySQL实现输入页码跳转到指定页面功能示例
2018/06/01 PHP
jQuery Flash/MP3/Video多媒体插件
2010/01/18 Javascript
Bookmarklet实现启动jQuery(模仿 云输入法)
2010/09/15 Javascript
使用GruntJS构建Web程序之构建篇
2014/06/04 Javascript
Jquery Ajax xmlhttp请求成功问题
2015/02/04 Javascript
Bootstrap项目实战之子栏目资讯内容
2016/04/25 Javascript
JS组件Bootstrap导航条使用方法详解
2016/04/29 Javascript
文本溢出插件jquery.dotdotdot.js使用方法详解
2017/06/22 jQuery
vue 数组和对象不能直接赋值情况和解决方法(推荐)
2017/10/25 Javascript
mui back 返回刷新页面的实例
2017/12/06 Javascript
vue自定义指令的创建和使用方法实例分析
2018/12/04 Javascript
vue实现多条件和模糊搜索功能
2019/05/28 Javascript
Vue项目中Api的组织和返回数据处理的操作
2019/11/04 Javascript
JavaScript canvas动画实现时钟效果
2020/02/10 Javascript
JS求解两数之和算法详解
2020/04/28 Javascript
深入理解 ES6中的 Reflect用法
2020/07/18 Javascript
jquery实现抽奖功能
2020/10/22 jQuery
8个非常实用的Vue自定义指令
2020/12/15 Vue.js
Pycharm学习教程(2) 代码风格
2017/05/02 Python
django rest framework之请求与响应(详解)
2017/11/06 Python
python实现pdf转换成word/txt纯文本文件
2018/06/07 Python
Django使用中间件解决前后端同源策略问题
2019/09/02 Python
python读取word 中指定位置的表格及表格数据
2019/10/23 Python
Pytorch.nn.conv2d 过程验证方式(单,多通道卷积过程)
2020/01/03 Python
Python转换字典成为对象,可以用&quot;.&quot;方式访问对象属性实例
2020/05/11 Python
python设置表格边框的具体方法
2020/07/17 Python
韩国知名的家庭购物网站:CJmall
2016/08/01 全球购物
Famous Footwear加拿大:美国多品牌运动休闲鞋店
2018/12/05 全球购物
俄罗斯珠宝市场的领导者之一:Бронницкий ювелир
2019/10/02 全球购物
行政文员岗位职责
2013/11/08 职场文书
安卓程序员求职信
2014/02/28 职场文书
2014年十一国庆节活动方案
2014/09/16 职场文书
财政局个人总结
2015/03/04 职场文书
详解Python+OpenCV绘制灰度直方图
2022/03/22 Python