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编程起步(第四课)
Jan 10 Javascript
获取客户端网卡MAC地址和IP地址实现JS代码
Mar 17 Javascript
前台js调用后台方法示例
Dec 02 Javascript
利用jQuery简单实现产品展示图片左右滚动功能(示例代码)
Jan 02 Javascript
js正则匹配出所有图片及图片地址src的方法
Jun 08 Javascript
jQuery实现的精美平滑二级下拉菜单效果代码
Mar 28 Javascript
浅谈jQuery中hide和fadeOut的区别 show和fadeIn的区别
Aug 18 Javascript
原JS实现banner图的常用功能
Jun 12 Javascript
详解如何实现一个简单的Node.js脚手架
Dec 04 Javascript
jQuery实现百度图片移入移出内容提示框上下左右移动的效果
Jun 05 jQuery
express框架中使用jwt实现验证的方法
Aug 25 Javascript
jquery实现鼠标悬浮弹出气泡提示框
Dec 23 jQuery
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
Zerg剧情介绍
2020/03/14 星际争霸
PHP实现分页的一个示例
2006/10/09 PHP
php getsiteurl()函数
2009/09/05 PHP
PHP实现的DES加密解密封装类完整实例
2017/04/29 PHP
swoole_process实现进程池的方法示例
2018/10/29 PHP
phpstudy2020搭建站点的实现示例
2020/10/30 PHP
javascript手工制作悬浮菜单
2015/02/12 Javascript
Bootstrap每天必学之模态框(Modal)插件
2016/04/26 Javascript
js实现可控制左右方向的无缝滚动效果
2016/05/29 Javascript
修改jquery中dialog的title属性方法(推荐)
2016/08/26 Javascript
JQuery控制DIV的选取实现方法
2016/09/18 Javascript
jQuery 局部div刷新和全局刷新方法总结
2016/10/05 Javascript
通俗解释JavaScript正则表达式快速记忆
2017/08/23 Javascript
Angular2学习笔记之数据绑定的示例代码
2018/01/03 Javascript
javascript少儿编程关于返回值的函数内容
2018/05/27 Javascript
React styled-components设置组件属性的方法
2018/08/07 Javascript
zepto.js 实时监听输入框的方法
2018/12/04 Javascript
微信小程序实现的绘制table表格功能示例
2019/04/26 Javascript
js实现跟随鼠标移动的小球
2019/08/26 Javascript
vue如何实现动态加载脚本
2020/02/05 Javascript
京东优选小程序的实现代码示例
2020/02/25 Javascript
js实现盒子移动动画效果
2020/08/09 Javascript
用Python脚本来删除指定容量以上的文件的教程
2015/05/04 Python
讲解Python中的标识运算符
2015/05/14 Python
基于python3 类的属性、方法、封装、继承实例讲解
2017/09/19 Python
tensorflow学习笔记之简单的神经网络训练和测试
2018/04/15 Python
django-crontab实现服务端的定时任务的示例代码
2020/02/17 Python
关于python scrapy中添加cookie踩坑记录
2020/11/17 Python
45个非常奇妙的CSS3 特性应用示例
2012/01/01 HTML / CSS
师范生教师实习自我鉴定
2013/09/27 职场文书
新学期班主任寄语
2014/01/18 职场文书
会计人员岗位职责
2015/02/03 职场文书
小学班级管理心得体会
2016/01/07 职场文书
vue动态绑定style样式
2022/04/20 Vue.js
git中cherry-pick命令的使用教程
2022/06/25 Servers
教你win10系统中APPCRASH事件问题解决方法
2022/07/15 数码科技