jQuery隐藏和显示效果实现


Posted in Javascript onApril 06, 2016

实例

jQuery hide()

简单的jQuery hide()方法演示。

jQuery hide()

另一个hide()实例。演示如何隐藏文本。

jQuery hide() 和 show()

通过 jQuery,您可以使用 hide() 和 show() 方法来隐藏和显示 HTML 元素:

实例

$("#hide").click(function(){
$("p").hide();
});
$("#show").click(function(){
$("p").show();
});

语法:

$(selector).hide(speed,callback);
$(selector).show(speed,callback);

可选的 speed 参数规定隐藏/显示的速度,可以取以下值:"slow"、"fast" 或毫秒。

可选的 callback 参数是隐藏或显示完成后所执行的函数名称。

下面的例子演示了带有 speed 参数的 hide() 方法:

实例

$("button").click(function(){
$("p").hide(1000);
});

jQuery toggle()

通过 jQuery,您可以使用 toggle() 方法来切换 hide() 和 show() 方法。

显示被隐藏的元素,并隐藏已显示的元素:

实例

$("button").click(function(){
$("p").toggle();
});

语法:

$(selector).toggle(speed,callback);

可选的 speed 参数规定隐藏/显示的速度,可以取以下值:"slow"、"fast" 或毫秒。

可选的 callback 参数是 toggle() 方法完成后所执行的函数名称。

Javascript 相关文章推荐
Javascript和Ajax中文乱码吐血版解决方案
Dec 21 Javascript
angularJS中$apply()方法详解
Jan 07 Javascript
谈一谈js中的执行环境及作用域
Mar 30 Javascript
JS实现漂亮的时间选择框效果
Aug 20 Javascript
jQuery中Find选择器用法示例
Sep 21 Javascript
JS基于正则表达式的替换操作(replace)用法示例
Apr 28 Javascript
详解VueJs前后端分离跨域问题
May 24 Javascript
javascript回调函数的概念理解与用法分析
May 27 Javascript
JS中的BOM应用
Feb 02 Javascript
JavaScript折半查找(二分查找)算法原理与实现方法示例
Aug 06 Javascript
webpack4+react多页面架构的实现
Oct 25 Javascript
JS函数基本定义与用法示例
Jan 15 Javascript
JS动态改变浏览器标题的方法
Apr 06 #Javascript
jQuery ajax提交Form表单实例(附demo源码)
Apr 06 #Javascript
JS密码生成与强度检测完整实例(附demo源码下载)
Apr 06 #Javascript
JS控制伪元素的方法汇总
Apr 06 #Javascript
JS实现把鼠标放到链接上出现滚动文字的方法
Apr 06 #Javascript
IE8 内存泄露(内存一直增长 )的原因及解决办法
Apr 06 #Javascript
jQuery实现HTML表格单元格的合并功能
Apr 06 #Javascript
You might like
php设计模式 Observer(观察者模式)
2011/06/26 PHP
浅谈php serialize()与unserialize()的用法
2013/06/05 PHP
Thinkphp中volist标签mod控制一定记录的换行BUG解决方法
2014/11/04 PHP
PHP实现的增强性mhash函数
2015/05/27 PHP
CodeIgniter框架钩子机制实现方法【hooks类】
2018/08/21 PHP
jquery.boxy插件的iframe扩展代码
2010/07/02 Javascript
ExtJS4 动态生成的grid导出为excel示例
2014/05/02 Javascript
javascript实现滑动解锁功能
2014/12/31 Javascript
全系IE支持Bootstrap的解决方法
2015/10/19 Javascript
基于jquery实现省市联动特效
2015/12/17 Javascript
基于javascript实现checkbox复选框实例代码
2016/01/28 Javascript
jQuery使用JSONP实现跨域获取数据的三种方法详解
2017/05/04 jQuery
Vue实现类似Spring官网图片滑动效果方法
2019/03/01 Javascript
理解JavaScript中的Proxy 与 Reflection API
2020/09/21 Javascript
pandas数值计算与排序方法
2018/04/12 Python
matplotlib.pyplot画图 图片的二进制流的获取方法
2018/05/24 Python
Python做智能家居温湿度报警系统
2018/09/25 Python
Python3 使用cookiejar管理cookie的方法
2018/12/28 Python
Python WEB应用部署的实现方法
2019/01/02 Python
python实现年会抽奖程序
2019/01/22 Python
分布式全文检索引擎ElasticSearch原理及使用实例
2020/11/14 Python
使用numpngw和matplotlib生成png动画的示例代码
2021/01/24 Python
python 基于DDT实现数据驱动测试
2021/02/18 Python
Mytheresa英国官网:拥有160多个奢侈品品牌
2016/10/09 全球购物
Fnac西班牙官网:法国文化和电子产品零售商
2021/03/14 全球购物
平面设计的岗位职责
2013/11/08 职场文书
战友聚会邀请函
2014/01/18 职场文书
物流业务员岗位职责
2014/02/08 职场文书
美丽家庭事迹材料
2014/05/03 职场文书
应聘护士求职信
2014/07/21 职场文书
小班教师个人总结
2015/02/05 职场文书
2015年幼儿园后勤工作总结
2015/04/25 职场文书
vue+element ui实现锚点定位
2021/06/29 Vue.js
Oracle数据库中通用的函数实例详解
2022/03/25 Oracle
Elasticsearch 数据类型及管理
2022/04/19 Python
Win11 Build 22000.829更新补丁KB5015882发布(附更新修复内容汇总)
2022/07/15 数码科技