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 相关文章推荐
改善你的jQuery的25个步骤 千倍级效率提升
Feb 11 Javascript
Ajax局部更新导致JS事件重复触发问题的解决方法
Oct 14 Javascript
Javascript基础教程之数据类型 (数值 Number)
Jan 18 Javascript
浅谈toLowerCase和toLocaleLowerCase的区别
Aug 15 Javascript
iview在vue-cli3如何按需加载的方法
Oct 31 Javascript
js如何获取图片url的Blob值并预览示例代码
Mar 07 Javascript
js console.log打印对象时属性缺失的解决方法
May 23 Javascript
开发中常用的25个JavaScript单行代码(小结)
Jun 28 Javascript
Vue实现导航栏的显示开关控制
Nov 01 Javascript
使用webpack搭建pixi.js开发环境
Feb 12 Javascript
webpack安装配置与常见使用过程详解(结合vue)
Jun 01 Javascript
javascript实现滚轮轮播图片
Dec 13 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
PHP分页显示制作详细讲解
2006/10/09 PHP
php.ini中date.timezone设置分析
2011/07/29 PHP
PHP 中关于ord($str)&amp;gt;0x80的详细说明
2012/09/23 PHP
php防止sql注入代码实例
2013/12/18 PHP
smarty模板中使用get、post、request、cookies、session变量的方法
2014/04/24 PHP
CodeIgniter模板引擎使用实例
2014/07/15 PHP
部署PHP时的4个配置修改说明
2015/10/19 PHP
JQuery 1.3.2以上版本中出现pareseerror错误的解决方法
2011/01/11 Javascript
JavaScript中判断变量是数组、函数或是对象类型的方法
2015/02/25 Javascript
分享10个原生JavaScript技巧
2015/04/20 Javascript
js实现Select列表各项上移和下移的方法
2015/08/14 Javascript
解决js图片加载时出现404的问题
2020/11/30 Javascript
jQuery+Ajax+PHP弹出层异步登录效果(附源码下载)
2016/05/27 Javascript
slideToggle+slideup实现手机端折叠菜单效果
2017/05/25 Javascript
深入探究AngularJs之$scope对象(作用域)
2017/07/20 Javascript
webpack项目调试以及独立打包配置文件的方法
2018/02/28 Javascript
npm 下载指定版本的组件方法
2018/05/17 Javascript
使用jquery模拟a标签的click事件无法实现跳转的解决
2018/12/04 jQuery
Vue.js 中的实用工具方法【推荐】
2019/07/04 Javascript
Python下载指定页面上图片的方法
2016/05/12 Python
一个基于flask的web应用诞生 用户注册功能开发(5)
2017/04/11 Python
简单了解什么是神经网络
2017/12/23 Python
Python远程linux执行命令实现
2020/11/11 Python
CSS3 渐变(Gradients)之CSS3 线性渐变
2016/07/08 HTML / CSS
美国著名的品牌折扣店:Burlington
2017/06/08 全球购物
巴西食品补充剂在线零售商:Músculos na Web
2017/08/07 全球购物
加拿大时尚床上用品零售商:QE Home | Quilts Etc
2018/01/22 全球购物
C#实现启动一个进程
2016/10/01 面试题
24岁生日感言
2014/01/13 职场文书
办理居住证介绍信
2014/01/15 职场文书
建设办主任四风问题整改思路和措施
2014/09/20 职场文书
群众路线教育实践活动自我剖析思想汇报
2014/10/04 职场文书
平安家庭事迹材料
2014/12/20 职场文书
迎新年主持词
2015/07/06 职场文书
golang实现浏览器导出excel文件功能
2022/03/25 Golang
nginx sticky实现基于cookie负载均衡示例详解
2022/12/24 Servers