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 相关文章推荐
javascript firefox不显示本地预览图片问题的解决方法
Nov 12 Javascript
在网页里看flash的trace数据的js类
Jan 10 Javascript
jQuery建立一个按字母顺序排列的友好页面索引(兼容IE6/7/8)
Feb 26 Javascript
jquery实现弹出窗口效果的实例代码
Nov 28 Javascript
js表单登陆验证示例
Oct 19 Javascript
详解jQuery中的DOM操作
Dec 23 Javascript
javaScript之split与join的区别(详解)
Nov 08 Javascript
react-router v4如何使用history控制路由跳转详解
Jan 09 Javascript
jQuery实现动画、消失、显现、渐出、渐入效果示例
Sep 06 jQuery
JS实现二维数组元素的排列组合运算简单示例
Jan 28 Javascript
微信小程序 setData 对 data数据影响问题
Apr 18 Javascript
react国际化化插件react-i18n-auto使用详解
Mar 31 Javascript
创建、调用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
老机欣赏|中国60年代精品收音机
2021/03/02 无线电
php array_intersect比array_diff快(附详细的使用说明)
2011/07/03 PHP
PHP设计模式之装饰者模式
2012/02/29 PHP
PHP使用strtotime计算两个给定日期之间天数的方法
2015/03/18 PHP
php+javascript实现的动态显示服务器运行程序进度条功能示例
2017/08/07 PHP
PHP addAttribute()函数讲解
2019/02/03 PHP
PHP的Trait机制原理与用法分析
2019/10/18 PHP
Jquery 弹出层插件实现代码
2009/10/24 Javascript
JQUERY获取form表单值的代码
2010/07/17 Javascript
基于jquery的表格排序
2010/09/11 Javascript
Javascript延迟执行实现方法(setTimeout)
2010/12/30 Javascript
javascript抖动元素的小例子
2013/10/28 Javascript
Jquery 获取指定标签的对象及属性的设置与移除
2014/05/29 Javascript
JavaScript弹出新窗口后向父窗口输出内容的方法
2015/04/06 Javascript
JS实现鼠标滑过折叠与展开菜单效果代码
2015/09/06 Javascript
探究Javascript模板引擎mustache.js使用方法
2016/01/26 Javascript
Javascript 正则表达式校验数字的简单实例
2016/11/02 Javascript
Angular使用Md5加密的解决方法
2017/09/16 Javascript
js 提取某()特殊字符串长度的实例
2017/12/06 Javascript
详解在React里使用&quot;Vuex&quot;
2018/04/02 Javascript
jQuery模拟12306城市选择框功能简单实现方法示例
2018/08/13 jQuery
vuex刷新后数据丢失的解决方法
2020/10/18 Javascript
Python实现的数据结构与算法之链表详解
2015/04/22 Python
用Python脚本来删除指定容量以上的文件的教程
2015/05/04 Python
Python中Continue语句的用法的举例详解
2015/05/14 Python
详解详解Python中writelines()方法的使用
2015/05/25 Python
Python文件右键找不到IDLE打开项解决办法
2015/06/08 Python
Python eval的常见错误封装及利用原理详解
2019/03/26 Python
Python实现滑动平均(Moving Average)的例子
2019/08/24 Python
numpy:np.newaxis 实现将行向量转换成列向量
2019/11/30 Python
Python scrapy增量爬取实例及实现过程解析
2019/12/24 Python
马德里运动鞋商店:Nigra Mercato
2020/02/16 全球购物
2014财产信托协议书范本
2014/11/18 职场文书
数学教师个人总结
2015/02/06 职场文书
Nginx配置Https安全认证的实现
2021/05/26 Servers
使用 Apache Superset 可视化 ClickHouse 数据的两种方法
2021/07/07 Servers