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 循环调用示例介绍
Nov 20 Javascript
基于javascript数组实现图片轮播
May 02 Javascript
jQuery实现的简单分页示例
Jun 01 Javascript
JavaScript的字符串方法汇总
Jul 31 Javascript
Js自动截取字符串长度,添加省略号(……)的实现方法
Mar 06 Javascript
Node.js读取文件内容示例
Mar 07 Javascript
JavaScript校验Number(4,1)格式的数字实例代码
Mar 13 Javascript
Angular4 中内置指令的基本用法
Jul 31 Javascript
微信小程序使用navigateTo数据传递的实例
Sep 26 Javascript
Vue.js子组件向父组件通信的方法实例代码详解
Dec 10 Javascript
Vue入门学习笔记【基本概念、对象、过滤器、指令等】
Apr 13 Javascript
vue调用本地摄像头实现拍照功能
Aug 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.MVC的模板标签系统(三)
2006/09/05 PHP
smarty模板局部缓存方法使用示例
2014/06/17 PHP
php防止用户重复提交表单
2015/11/02 PHP
ThinkPHP5+Layui实现图片上传加预览功能
2018/08/17 PHP
把html页面的部分内容保存成新的html文件的jquery代码
2009/11/12 Javascript
Javascript验证用户输入URL地址是否为空及格式是否正确
2014/10/09 Javascript
jQuery中的编程范式详解
2014/12/15 Javascript
JSON与XML优缺点对比分析
2015/07/17 Javascript
详解JavaScript中的4种类型识别方法
2015/09/14 Javascript
JavaScript如何动态创建table表格
2020/08/02 Javascript
给before和after伪元素设置js效果的方法
2015/12/04 Javascript
利用React-router+Webpack快速构建react程序
2016/10/27 Javascript
基于JavaScript实现复选框的全选和取消全选
2017/02/09 Javascript
jQuery 实时保存页面动态添加的数据的示例
2017/08/14 jQuery
vue elementui form表单验证的实现
2018/11/11 Javascript
vue基础之事件v-onclick=&quot;函数&quot;用法示例
2019/03/11 Javascript
基于JS判断对象是否是数组
2020/01/10 Javascript
vue项目中监听手机物理返回键的实现
2020/01/18 Javascript
javascript实现京东登录显示隐藏密码
2020/08/02 Javascript
Pyramid Mako模板引入helper对象的步骤方法
2013/11/27 Python
Python跨文件全局变量的实现方法示例
2017/12/10 Python
python 画出使用分类器得到的决策边界
2019/08/21 Python
Python 字典中的所有方法及用法
2020/06/10 Python
python math模块的基本使用教程
2021/01/16 Python
法国珠宝店:CLEOR
2017/01/29 全球购物
教师应聘个人求职信
2013/12/10 职场文书
委托证明的格式
2014/01/10 职场文书
大课间活动制度
2014/01/18 职场文书
2014年班长个人工作总结
2014/11/14 职场文书
2015年纪检监察工作总结
2015/04/08 职场文书
比赛主持人开场白
2015/05/29 职场文书
煤矿安全生产管理协议书
2016/03/22 职场文书
2016年“我们的节日·端午节”活动总结
2016/04/01 职场文书
Nginx服务器添加Systemd自定义服务过程解析
2021/03/31 Servers
MongoDB使用场景总结
2022/02/24 MongoDB
Pytorch中使用ImageFolder读取数据集时忽略特定文件
2022/03/23 Python