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 相关文章推荐
xml分页+ajax请求数据源+dom取结果实例代码
Oct 31 Javascript
Node.js中的事件驱动编程详解
Aug 16 Javascript
js父页面与子页面不同时显示的方法
Oct 16 Javascript
jQuery源码解读之addClass()方法分析
Feb 20 Javascript
js代码实现下拉菜单【推荐】
Dec 15 Javascript
Angular 4依赖注入学习教程之Injectable装饰器(六)
Jun 04 Javascript
js+html5实现半透明遮罩层弹框效果
Aug 24 Javascript
Bootstrap table使用方法记录
Aug 23 Javascript
JavaScript中使用参数个数实现重载功能
Sep 01 Javascript
vue实现模态框的通用写法推荐
Feb 26 Javascript
Node.js之readline模块的使用详解
Mar 25 Javascript
javascript 数组(list)添加/删除的实现
Dec 17 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
PHP5 字符串处理函数大全
2010/03/23 PHP
php循环检测目录是否存在并创建(循环创建目录)
2011/01/06 PHP
PHP curl 并发最佳实践代码分享
2012/09/05 PHP
php 删除一维数组中某一个值元素的操作方法
2018/02/01 PHP
PHP sdk实现在线打包代码示例
2020/12/09 PHP
JavaScript DOM 学习第七章 表单的扩展
2010/02/19 Javascript
围观tangram js库
2010/12/28 Javascript
input输入框的自动匹配(原生代码)
2013/03/19 Javascript
textarea焦点的用法实现获取焦点清空失去焦点提示效果
2014/05/19 Javascript
原生javascript实现隔行换色
2015/01/04 Javascript
Js的Array数组对象详解
2016/02/22 Javascript
Vue2.0组件间数据传递示例
2017/03/07 Javascript
vue绑定的点击事件阻止冒泡的实例
2018/02/08 Javascript
小程序数据通信方法大全(推荐)
2019/04/15 Javascript
详解微信小程序开发聊天室—实时聊天,支持图片预览
2019/05/20 Javascript
JS实现联想、自动补齐国家或地区名称的功能
2020/07/07 Javascript
jQuery 实现扁平式小清新导航
2020/07/07 jQuery
[41:52]2018DOTA2亚洲邀请赛3月29日 小组赛A组 TNC VS OpTic
2018/03/30 DOTA
探究数组排序提升Python程序的循环的运行效率的原因
2015/04/01 Python
使用Django和Python创建Json response的方法
2018/03/26 Python
Python socket套接字实现C/S模式远程命令执行功能案例
2018/07/06 Python
Pycharm无法显示动态图片的解决方法
2018/10/28 Python
运用Python的webbrowser实现定时打开特定网页
2019/02/21 Python
Python中函数的返回值示例浅析
2019/08/28 Python
python图形界面开发之wxPython树控件使用方法详解
2020/02/24 Python
Pandas对DataFrame单列/多列进行运算(map, apply, transform, agg)
2020/06/14 Python
详解tf.device()指定tensorflow运行的GPU或CPU设备实现
2021/02/20 Python
瑞典香水、须后水和美容产品购物网站:Parfym-Klick.se
2019/12/29 全球购物
大型活动策划方案
2014/01/12 职场文书
网上开商店的创业计划书
2014/01/19 职场文书
小学教师听课制度
2014/02/01 职场文书
深入开展党的群众路线教育实践活动方案
2014/02/04 职场文书
秦兵马俑教学反思
2014/02/07 职场文书
职业生涯规划书范文
2014/03/10 职场文书
2015年医德考评自我评价
2015/03/03 职场文书
Django drf请求模块源码解析
2021/06/08 Python