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 相关文章推荐
JSON 数据格式介绍
Jan 13 Javascript
JS中的this变量的使用介绍
Oct 21 Javascript
jquery自动切换tabs选项卡的具体实现
Dec 24 Javascript
Node.js中使用事件发射器模式实现事件绑定详解
Aug 15 Javascript
前端轻量级MVC框架CanJS详解
Sep 26 Javascript
jQuery实现彩带延伸效果的网页加载条loading动画
Oct 29 Javascript
以JavaScript来实现WordPress中的二级导航菜单的方法
Dec 14 Javascript
JS实现的几个常用算法
Nov 12 Javascript
Kendo Grid editing 自定义验证报错提示的解决方法
Nov 18 Javascript
微信小程序实现页面分享onShareAppMessage
Aug 12 Javascript
Vue实现简单的留言板
Oct 23 Javascript
用javascript制作qq注册动态页面
Apr 14 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远程连接MYSQL数据库非常慢的解决方法
2008/07/05 PHP
php实现的微信红包算法分析(非官方)
2015/09/25 PHP
CI框架源码解读之利用Hook.php文件完成功能扩展的方法
2016/05/18 PHP
javascript FormatNumber函数实现方法
2008/12/30 Javascript
javascript cookie操作类的实现代码小结附使用方法
2010/06/02 Javascript
jquery快捷动态绑定键盘事件的操作函数代码
2013/10/17 Javascript
js跑步算法的实现代码
2013/12/04 Javascript
javascript写的异步加载js文件函数(支持数组传参)
2014/06/07 Javascript
JSON.stringify转换JSON时日期时间不准确的解决方法
2014/08/08 Javascript
JS 排序输出实现table行号自增前端动态生成的tr
2014/08/13 Javascript
node.js中的fs.readSync方法使用说明
2014/12/17 Javascript
javascript 兼容各个浏览器的事件
2015/02/04 Javascript
jQuery幻灯片特效代码分享--鼠标滑过按钮时切换(2)
2020/11/18 Javascript
javascript bom是什么及bom和dom的区别
2015/11/26 Javascript
JS DOMReady事件的六种实现方法总结
2016/11/23 Javascript
js控制一个按钮是否可点击(可使用)disabled的实例
2017/02/14 Javascript
vue-quill-editor实现图片上传功能
2017/08/08 Javascript
用JS编写一个函数,返回数组中重复出现过的元素(实例)
2017/09/14 Javascript
JavaScript对象的浅拷贝与深拷贝实例分析
2018/07/25 Javascript
JS判断用户用的哪个浏览器实例详解
2018/10/09 Javascript
利用不到200行代码写一款属于你自己的js类库
2019/07/08 Javascript
Node.js设置定时任务之node-schedule模块的使用详解
2020/04/28 Javascript
pytorch 模拟关系拟合——回归实例
2020/01/14 Python
Python pip配置国内源的方法
2020/02/14 Python
django queryset相加和筛选教程
2020/05/18 Python
如何将无状态会话Bean发布为WEB服务,只有无状态会话Bean可以发布为WEB服务?
2015/12/03 面试题
会计工作心得体会
2014/01/13 职场文书
领导接待方案
2014/03/13 职场文书
出国留学经济担保书
2014/04/01 职场文书
《晚上的太阳》教学反思
2014/04/23 职场文书
测控技术自荐信
2014/06/05 职场文书
运动会口号16字
2014/06/07 职场文书
初中开学典礼新闻稿
2015/07/17 职场文书
详解MySQL的半同步
2021/04/22 MySQL
pytorch实现手写数字图片识别
2021/05/20 Python
React如何使用axios请求数据并把数据渲染到组件
2022/08/05 Javascript