jQuery实现菜单的显示和隐藏功能示例


Posted in jQuery onJuly 24, 2018

本文实例讲述了jQuery实现菜单的显示和隐藏功能。分享给大家供大家参考,具体如下:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>3water.com jQuery显示菜单隐藏和显示</title>
 </head>
<body>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script>
  /*jQuery演示*/
  $(function(){
   $("#div1").click(function(){
     if($(".div2").css("display")=="block"){
      $(".div2").css("display","none");
    }else {
      $(".div2").css("display","block");
    }
   });
   });
</script>
<!--div演示-->
<input id="div1" type="button" value="显示/隐藏">
<div class="div2" style="display: block">
  <ui>
    <li>aaaa</li>
    <li>aaaa</li>
    <li>aaaa</li>
    <li>aaaa</li>
  </ui>
</div>
</body>
</html>

使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试,效果如下:

jQuery实现菜单的显示和隐藏功能示例

希望本文所述对大家jQuery程序设计有所帮助。

jQuery 相关文章推荐
基于JQuery和原生JavaScript实现网页定位导航特效
Apr 03 jQuery
jquery仿京东商品放大浏览页面
Jun 06 jQuery
JQuery.dataTables表格插件添加跳转到指定页
Jun 09 jQuery
jQuery实现可拖动进度条实例代码
Jun 21 jQuery
jQuery菜单实例(全选,反选,取消)
Aug 28 jQuery
实现jquery放大镜的两种方法
Feb 22 jQuery
jQuery实现的简单对话框拖动功能示例
Jun 05 jQuery
jQuery使用bind动态绑定事件无效的处理方法
Dec 11 jQuery
jQuery实现的鼠标拖动浮层功能示例【拖动div等任何标签】
Dec 29 jQuery
jquery获取file表单选择文件的路径、名字、大小、类型
Jan 18 jQuery
如何使用CSS3和JQuery easing 插件制作绚丽菜单
Jun 18 jQuery
jquery实现两个div中的元素相互拖动的方法分析
Apr 05 jQuery
jQuery实现的监听导航滚动置顶状态功能示例
Jul 23 #jQuery
jquery实现搜索框功能实例详解
Jul 23 #jQuery
jQuery实现的点击按钮改变样式功能示例
Jul 21 #jQuery
jQuery实现输入框的放大和缩小功能示例
Jul 21 #jQuery
jQuery实现table表格信息的展开和缩小功能示例
Jul 21 #jQuery
jQuery实现表单动态添加数据并提交的方法
Jul 19 #jQuery
jQuery实现监听下拉框选中内容发生改变操作示例
Jul 13 #jQuery
You might like
PHP 读取和修改大文件的某行内容的代码
2009/10/30 PHP
php实现计数器方法小结
2015/01/05 PHP
php实现的mongodb操作类
2015/05/28 PHP
BOOM vs RR BO5 第三场 2.14
2021/03/10 DOTA
jQuery 在光标定位的地方插入文字的插件
2012/05/10 Javascript
疯狂Jquery第一天(Jquery学习笔记)
2012/05/11 Javascript
解析js如何获取当前url中的参数值并复制给input
2013/06/23 Javascript
JavaScript:Date类型全面解析
2016/05/19 Javascript
jquery树形菜单效果的简单实例
2016/06/06 Javascript
Bootstrap基本组件学习笔记之下拉菜单(7)
2016/12/07 Javascript
JavaScript评论点赞功能的实现方法
2017/03/13 Javascript
js实现适配不同的屏幕大小
2017/04/10 Javascript
基于vue实现可搜索下拉框定制组件
2020/03/26 Javascript
Vue.js中的组件系统
2019/05/30 Javascript
Vue实现简单购物车功能
2020/12/13 Vue.js
[03:03]DOTA2 2017国际邀请赛开幕战队入场仪式
2017/08/09 DOTA
Python写的一个定时重跑获取数据库数据
2016/12/28 Python
Python过滤txt文件内重复内容的方法
2018/10/21 Python
python实现扫描局域网指定网段ip的方法
2019/04/16 Python
itchat-python搭建微信机器人(附示例)
2019/06/11 Python
centos 安装Python3 及对应的pip教程详解
2019/06/28 Python
Python爬虫如何应对Cloudflare邮箱加密
2020/06/24 Python
Python如何截图保存的三种方法(小结)
2020/09/01 Python
Python基于Webhook实现github自动化部署
2020/11/28 Python
python 基于opencv 绘制图像轮廓
2020/12/11 Python
python 如何把docker-compose.yaml导入到数据库相关条目里
2021/01/15 Python
世界上最大的餐具公司:Oneida
2016/12/17 全球购物
伦敦著名的运动鞋综合商店:Footpatrol
2019/03/25 全球购物
全球最大化妆品零售网站:SkinStore
2020/10/24 全球购物
运动会方队口号
2014/06/07 职场文书
体育节口号
2014/06/19 职场文书
三年级学生评语大全
2014/12/26 职场文书
幼儿园教师辞职信
2019/06/21 职场文书
面试被问select......for update会锁表还是锁行
2021/11/11 MySQL
Pytorch中expand()的使用(扩展某个维度)
2022/07/15 Python
前端与RabbitMQ实时消息推送未读消息小红点实现示例
2022/07/23 Java/Android