jQuery中hide()方法用法实例


Posted in Javascript onDecember 24, 2014

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

此方法可以将匹配元素隐藏。

hide()方法的用法:
此方法如果没有对隐藏效果加以时间限定,那么匹配元素会被瞬间隐藏。例如:

$("div").hide()

以上代码可以将所有div元素瞬间隐藏。
如果方法对隐藏效果加以时间限定,那么匹配元素将会在限定的事件内以比较优雅的形式隐藏。例如:
$("div").hide(2000)

以上代码可以将所有div元素在2000毫秒(2秒)内隐藏。
此方法也可以在隐藏完成后触发一个回调函数。例如:
$("div").hide(2000,function(){alert("我隐藏好了")});

实例代码:
<!DOCTYPE html>

<html>

<head>

<meta charset=" utf-8">

<meta name="author" content="https://3water.com/" />

<title>hide()函数-三水点靠木</title> 

<style type="text/css">

div{

  color:blue;

  background-color:green;

  width:100px;

  height:100px;

  margin-top:10px;

}

</style>

<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>

<script type="text/javascript">

$(document).ready(function(){

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

    $(".first").hide();

  })

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

    $(".second").hide(2000,function(){alert("我隐藏好了")});

  })

})

</script>

</head>

<body>

  <div class="first"></div>

  <div class="second"></div>

  <button id="first">瞬间隐藏</button>

  <button id="second">优雅的隐藏</button>

</body>

</html>

以上代码能够在隐藏完成以后触发回调函数,于是弹出一个提示框。

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

Javascript 相关文章推荐
js关于字符长度限制的问题示例探讨
Jan 24 Javascript
js拼接html注意问题示例探讨
Jul 14 Javascript
字段太多jquey快速清空表单内容方法
Aug 21 Javascript
深入浅出 jQuery中的事件机制
Aug 23 Javascript
JS自动生成动态HTML验证码页面
Jun 14 Javascript
js实现图片轮播效果学习笔记
Jul 26 Javascript
微信小程序实现美团菜单
Jun 06 Javascript
通过原生vue添加滚动加载更多功能
Nov 21 Javascript
vue-iview动态新增和删除的方法
Jun 17 Javascript
微信小程序的引导页实现代码
Jun 24 Javascript
vue实现自定义多选按钮
Jul 16 Javascript
Vue实现手机号、验证码登录(60s禁用倒计时)
Dec 19 Vue.js
创建、调用JavaScript对象的方法集锦
Dec 24 #Javascript
jQuery的css()方法用法实例
Dec 24 #Javascript
使用javascript获取页面名称
Dec 23 #Javascript
jQuery类选择器用法实例
Dec 23 #Javascript
基于JQuery制作可编辑的表格特效
Dec 23 #Javascript
JavaScript调试工具汇总
Dec 23 #Javascript
jQuery制作简洁的多级联动Select下拉框
Dec 23 #Javascript
You might like
frename PHP 灵活文件命名函数 frename
2009/09/09 PHP
php调用nginx的mod_zip模块打包ZIP文件
2014/06/11 PHP
Destoon旺旺无法正常显示,点击提示“会员名不存在”的解决办法
2014/06/21 PHP
简要剖析PHP的Yii框架的组件化机制的基本知识
2016/03/17 PHP
javascript 三种方法实现获得和设置以及移除元素属性
2013/03/20 Javascript
jQuery之尺寸调整组件的深入解析
2013/06/19 Javascript
node.js中Socket.IO的进阶使用技巧
2014/11/04 Javascript
js倒计时抢购实例
2015/12/20 Javascript
老生常谈 js中this的指向
2016/06/30 Javascript
jQuery实现的兼容性浮动层示例
2016/08/02 Javascript
jQuery使用animate实现ul列表项相互飘动效果示例
2016/09/16 Javascript
nodejs爬虫遇到的乱码问题汇总
2017/04/07 NodeJs
Nodejs实现的操作MongoDB数据库功能完整示例
2019/02/02 NodeJs
python zip文件 压缩
2008/12/24 Python
Python使用函数默认值实现函数静态变量的方法
2014/08/18 Python
举例讲解Linux系统下Python调用系统Shell的方法
2015/11/07 Python
Python中import导入上一级目录模块及循环import问题的解决
2016/06/04 Python
Python中Scrapy爬虫图片处理详解
2017/11/29 Python
python 编码规范整理
2018/05/05 Python
python获取代码运行时间的实例代码
2018/06/11 Python
详解分布式任务队列Celery使用说明
2018/11/29 Python
快速解决vue.js 模板和jinja 模板冲突的问题
2019/07/26 Python
Flask框架 CSRF 保护实现方法详解
2019/10/30 Python
python 如何区分return和yield
2020/09/22 Python
python 实现一个图形界面的汇率计算器
2020/11/09 Python
python语言time库和datetime库基本使用详解
2020/12/25 Python
意大利体育用品和运动服网上商店:Maxi Sport
2019/09/14 全球购物
建筑工程实习自我鉴定
2013/09/19 职场文书
kfc实习自我鉴定
2013/12/14 职场文书
教育英语专业毕业生的求职信
2014/03/13 职场文书
房地产资料员岗位职责
2014/07/02 职场文书
教师个人读书活动总结
2014/07/08 职场文书
2014年乡镇领导个人整改措施
2014/09/19 职场文书
购房协议书范本
2014/10/02 职场文书
高中信息技术教学反思
2016/02/16 职场文书
JavaScript流程控制(循环)
2021/12/06 Javascript