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 相关文章推荐
BootStrap中jQuery插件Carousel实现轮播广告效果
Mar 27 jQuery
jquery Ajax实现Select动态添加数据
Jun 08 jQuery
jquery处理checkbox(复选框)是否被选中实例代码
Jun 12 jQuery
jQuery 实现图片的依次加载图片功能
Jul 06 jQuery
jQuery实现图片上传预览效果功能完整实例【测试可用】
May 28 jQuery
jQuery实现的简单拖拽功能示例【测试可用】
Aug 14 jQuery
jQuery md5加密插件jQuery.md5.js用法示例
Aug 24 jQuery
jquery+php后台实现省市区联动功能示例
May 23 jQuery
非常实用的jQuery代码段集锦【检测浏览器、滚动、复制、淡入淡出等】
Aug 08 jQuery
Javascript和jquery在selenium的使用过程
Oct 31 jQuery
jQuery表单校验插件validator使用方法详解
Feb 18 jQuery
jQuery实现简单三级联动效果
Sep 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使用simplexml_load_file加载XML文件并显示XML的方法
2015/03/19 PHP
PHP封装的HttpClient类用法实例
2015/06/17 PHP
php中序列化与反序列化详解
2017/02/13 PHP
利用js获取服务器时间的两个简单方法
2010/01/08 Javascript
Javascript string 扩展库代码
2010/04/09 Javascript
js几秒以后倒计时跳转示例
2013/12/26 Javascript
原生javascript实现Tab选项卡切换功能
2015/01/12 Javascript
JS基于面向对象实现的放烟花效果
2015/05/07 Javascript
基于javascript实现仿百度输入框自动匹配功能
2016/01/03 Javascript
javascript中错误使用var造成undefined
2016/03/31 Javascript
基于Angularjs+mybatis实现二级评论系统(仿简书)
2017/02/13 Javascript
NodeJS基础API搭建服务器详细过程记录
2017/04/01 NodeJs
javascript 中iframe高度自适应(同域)实例详解
2017/05/16 Javascript
简单实现jQuery弹窗效果
2017/10/30 jQuery
JS动态添加元素及绑定事件造成程序重复执行解决
2017/12/07 Javascript
JS设计模式之观察者模式实现实时改变页面中金额数的方法
2018/02/05 Javascript
JS实现遍历不规则多维数组的方法
2018/03/21 Javascript
vue父组件异步获取数据传给子组件的方法
2018/07/26 Javascript
JavaScript函数、闭包、原型、面向对象学习笔记
2018/09/06 Javascript
vue3.0 CLI - 1 - npm 安装与初始化的入门教程
2018/09/14 Javascript
Vue多环境代理配置方法思路详解
2019/06/21 Javascript
vue 获取到数据但却渲染不到页面上的解决方法
2020/11/19 Vue.js
[41:37]DOTA2北京网鱼队选拔赛——冲击职业之路
2015/04/13 DOTA
python实现线程池的方法
2015/06/30 Python
Python实现树的先序、中序、后序排序算法示例
2017/06/23 Python
Pytorch中index_select() 函数的实现理解
2019/11/19 Python
使用Python进行防病毒免杀解析
2019/12/13 Python
python多线程实现代码(模拟银行服务操作流程)
2020/01/13 Python
Python描述数据结构学习之哈夫曼树篇
2020/09/07 Python
迪拜领先运动补剂零售品牌中文站:Sporter商城
2019/08/20 全球购物
《逃家小兔》教学反思
2014/02/23 职场文书
信息与计算科学专业推荐信
2014/02/23 职场文书
房地产促销活动方案
2014/03/01 职场文书
党的群众路线对照检查材料思想汇报(学校)
2014/10/04 职场文书
MySQL Router的安装部署
2021/04/24 MySQL
python 安全地删除列表元素的方法
2022/03/16 Python