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 ajax动态新增节点无法触发点击事件的问题
May 24 jQuery
jQuery validata插件实现方法
Jun 25 jQuery
jQuery事件_动力节点Java学院整理
Jul 05 jQuery
jQuery之动画ajax事件(实例讲解)
Jul 18 jQuery
jQuery实现IE输入框完成placeholder标签功能的方法
Sep 20 jQuery
jQuery实现checkbox的简单操作
Nov 18 jQuery
jQuery幻灯片插件owlcarousel参数说明中文文档
Feb 27 jQuery
20个最常见的jQuery面试问题及答案
May 23 jQuery
jQuery仿移动端支付宝键盘的实现代码
Aug 15 jQuery
JQuery属性操作与循环用法示例
May 15 jQuery
jQuery+PHP+Ajax实现动态数字统计展示功能
Dec 25 jQuery
jQuery实现鼠标滑动切换图片
May 27 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
转生史莱姆:萌王第一次撸串开心到飞起,哥布塔撸串却神似界王神
2018/11/30 日漫
php安全配置 如何配置使其更安全
2011/12/16 PHP
PHP 数组和字符串互相转换实现方法
2013/03/26 PHP
50个PHP程序性能优化的方法
2014/06/02 PHP
php数组操作之键名比较与差集、交集赋值的方法
2014/11/10 PHP
php变量与数组相互转换的方法(extract与compact)
2016/12/02 PHP
PHP实现的迪科斯彻(Dijkstra)最短路径算法实例
2017/09/16 PHP
Laravel框架自定义验证过程实例分析
2019/02/01 PHP
PHP 计算两个时间段之间交集的天数示例
2019/10/24 PHP
PHP Swoole异步读取、写入文件操作示例
2019/10/24 PHP
javascript学习(二)javascript常见问题总结
2013/01/02 Javascript
javascript 树形导航菜单实例代码
2013/08/13 Javascript
深入分析Javascript事件代理
2016/01/30 Javascript
JavaScript事件详细讲解
2016/06/27 Javascript
Bootstrap 网站实例之单页营销网站
2016/10/20 Javascript
Bootstrap源码解读模态弹出框(11)
2016/12/28 Javascript
AngularJS Select(选择框)使用详解
2017/01/18 Javascript
微信小程序--组件(swiper)详细介绍
2017/06/13 Javascript
JavaScript之RegExp_动力节点Java学院整理
2017/06/29 Javascript
ES6 class的应用实例分析
2019/06/27 Javascript
vue实现购物车小案例
2019/09/27 Javascript
JavaScript实现文件下载并重命名代码实例
2019/12/12 Javascript
原生JS实现音乐播放器的示例代码
2021/02/25 Javascript
pyqt4教程之messagebox使用示例分享
2014/03/07 Python
Python 实现简单的电话本功能
2015/08/09 Python
python 捕获 shell/bash 脚本的输出结果实例
2017/01/04 Python
python Web开发你要理解的WSGI &amp; uwsgi详解
2018/08/01 Python
python3爬虫学习之数据存储txt的案例详解
2019/04/24 Python
Java里面有没有全局变量?为什么?
2015/02/06 面试题
信息专业学生学习的自我评价
2014/02/17 职场文书
仓库文员岗位职责
2014/04/06 职场文书
《新型玻璃》教学反思
2014/04/13 职场文书
担保书格式范文
2015/09/22 职场文书
一行代码python实现文件共享服务器
2021/04/22 Python
Python Parser的用法
2021/05/12 Python
SQLServer之常用函数总结详解
2021/08/30 SQL Server