jquery中show()、hide()和toggle()用法实例


Posted in Javascript onJanuary 15, 2015

本文实例讲述了jquery中show()、hide()和toggle()用法。分享给大家供大家参考。具体分析如下:

这里介绍了jquery效果:show()方法、hide()方法和toggle()方法
现实应用场景:QQ面板里我的好友分组

<html>

<head>

<title>jquery效果:show()方法、hide()方法和toggle()方法</title>

<script type="text/javascript" src="jquery-1.8.2.min.js"></script>

<script type="text/javascript">

$(document).ready(function(){

 $("#show").click(function(){

  $("p").show();

 });

 $("#hide").click(function(){

  $("p").hide(2000);

 });

 $("#tog").click(function(){

  $("p").toggle("slow");

 });

});

</script>

</head>

<body>

<button id="show">显示</button><button id="hide">隐藏</button><button id="tog">切换</button>

<p>这是一个段落这是一个段落这是一个段落这是一个段落这是一个段落这是一个段落</p>

</body>

</html>

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

Javascript 相关文章推荐
Javascript创建Silverlight Plugin以及自定义nonSilverlight和lowSilverlight样式
Jun 28 Javascript
JavaScript如何自定义trim方法
Jul 28 Javascript
js实现选中页面文字将其分享到新浪微博
Nov 05 Javascript
chrome浏览器如何断点调试异步加载的JS
Sep 05 Javascript
angular过滤器实现排序功能
Jun 27 Javascript
彻底解决 webpack 打包文件体积过大问题
Jul 07 Javascript
如何理解Vue的作用域插槽的实现原理
Aug 19 Javascript
JavaScript中数组常见操作技巧
Sep 01 Javascript
JavaScript实现职责链模式概述
Jan 25 Javascript
jQuery实现的页面弹幕效果【测试可用】
Aug 17 jQuery
vue 自定义指令自动获取文本框焦点的方法
Aug 25 Javascript
如何通过Proxy实现JSBridge模块化封装
Oct 22 Javascript
用js判断是否为360浏览器的实现代码
Jan 15 #Javascript
jquery果冻抖动效果实现方法
Jan 15 #Javascript
jquery通过ajax加载一段文本内容的方法
Jan 15 #Javascript
js实现遮罩层弹出框的方法
Jan 15 #Javascript
jquery隔行换色效果实现方法
Jan 15 #Javascript
JavaScript中实现依赖注入的思路分享
Jan 15 #Javascript
jquery实现textarea输入框限制字数的方法
Jan 15 #Javascript
You might like
JavaScript国旗变换效果代码
2008/08/13 Javascript
javascript 学习之旅 (2)
2009/02/05 Javascript
Mootools 图片展示插件(lightbox,ImageMenu)收集集合
2010/05/21 Javascript
jquery ui resizable bug解决方法
2010/10/26 Javascript
为你的网站增加亮点的9款jQuery插件推荐
2011/05/03 Javascript
javascript面向对象之共享成员属性与方法及prototype关键字用法
2015/01/13 Javascript
jQuery中text() val()和html()的区别实例详解
2016/06/28 Javascript
jQuery设置和获取select、checkbox、radio的选中值方法
2017/01/01 Javascript
bootstrap滚动监控器使用方法解析
2017/01/13 Javascript
JS实现本地存储信息的方法(基于localStorage与userData)
2017/02/18 Javascript
JavaScript-定时器0~9抽奖系统详解(代码)
2017/08/16 Javascript
jQuery插件DataTables分页开发心得体会
2017/08/22 jQuery
vue无限轮播插件代码实例
2019/05/10 Javascript
Vue插件之滑动验证码
2019/09/21 Javascript
vue把输入框的内容添加到页面的实例讲解
2019/11/11 Javascript
详解Vue template 如何支持多个根结点
2020/02/10 Javascript
Python中的jquery PyQuery库使用小结
2014/05/13 Python
Centos Python2 升级到Python3的简单实现
2016/06/21 Python
Python win32com 操作Exce的l简单方法(必看)
2017/05/25 Python
Python元组操作实例分析【创建、赋值、更新、删除等】
2017/07/24 Python
Django admin实现图书管理系统菜鸟级教程完整实例
2017/12/12 Python
如何用Python实现简单的Markdown转换器
2018/07/16 Python
win8下python3.4安装和环境配置图文教程
2018/07/31 Python
Python3编码问题 Unicode utf-8 bytes互转方法
2018/10/26 Python
浅谈django url请求与数据库连接池的共享问题
2019/08/29 Python
解决Python paramiko 模块远程执行ssh 命令 nohup 不生效的问题
2020/07/14 Python
python如何实现递归转非递归
2021/02/25 Python
html5 拖拽及用 js 实现拖拽功能的示例代码
2020/10/23 HTML / CSS
详解如何解决H5开发使用wx.hideMenuItems无效果不生效
2021/01/20 HTML / CSS
俄罗斯护发和专业化妆品购物网站:Hihair
2019/09/28 全球购物
俄罗斯天然和有机产品、健康生活网上商店:Fitomarket.ru
2020/10/09 全球购物
房地产员工找工作的自我评价
2013/11/15 职场文书
综合实践活动总结
2014/05/05 职场文书
秋季运动会广播稿(30篇)
2014/09/13 职场文书
2015年科室工作总结
2015/04/10 职场文书
Vue Element plus使用方法梳理
2022/12/24 Vue.js