jQuery_效果(隐藏和显示)
一、jQuery hide() 显示和 show()隐藏
通过 jQuery，您可以使用 hide() 和 show() 方法来隐藏和显示 HTML 元素：
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
$('#hide').click(function(){
$("p").hide();
})
$('#show').click(function(){
$("p").show();
});
});
</script>
</head>
<body>
<p id="p1">如果点击“隐藏”按钮，我就会消失。如果点击“显示”按钮，我又出现啦</p>
<button id="hide" type="button">隐藏</button>
<button id="show" type="button">显示</button>
</body>
语法：
$(selector).hide(speed,callback); $(selector).show(speed,callback);
可选的 speed 参数规定隐藏/显示的速度，可以取以下值："slow"、"fast" 或毫秒。
可选的 callback 参数是隐藏或显示完成后所执行的函数名称。
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
$('#hide').click(function(){
$("p").hide(1000);//给hide加上参数
})
$('#show').click(function(){
$("p").show(1000);
});
});
</script>
</head>
<body>
<p id="p1">如果点击“隐藏”按钮，我就会消失。如果点击“显示”按钮，我又出现啦</p>
<button id="hide" type="button">隐藏</button>
<button id="show" type="button">显示</button>
</body>
二、jQuery toggle()方法
通过 jQuery，您可以使用 toggle() 方法来切换 hide() 和 show() 方法。显示被隐藏的元素，并隐藏已显示的元素：
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
$('#hide').click(function(){
$("p").toggle(1000);//给hide加上参数
});
});
</script>
</head>
<body>
<p id="p1">如果点击"隐藏/显示"按钮，我就会消失或者出现啦</p>
<button id="hide" type="button">隐藏/显示</button>
</body>
语法：
$(selector).toggle(speed,callback);
可选的 speed 参数规定隐藏/显示的速度，可以取以下值："slow"、"fast" 或毫秒。
可选的 callback 参数是 toggle() 方法完成后所执行的函数名称。
jQuery_效果(隐藏和显示)的更多相关文章
- jQuery 效果 —— 隐藏和显示
jQuery 效果 -- 隐藏和显示 1.隐藏和显示 (1)在jQuery中我们可以使用hide()和show()分别隐藏和显示HTML元素: //隐藏元素 $("button") ...
- Jquery_效果-隐藏显示、淡入淡出、滑动面板、简单的动画队列
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="U ...
- jQuery效果---隐藏与显示
隐藏与显示 index.html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"& ...
- jQuery效果------隐藏hide()/显示show()
hide()和show() hide():隐藏文本. show():显示文本. 语法: $(selector).hide(speed,callback); $(selector).show(speed ...
- jquery02-jQuery效果=隐藏和显示+切换+淡入淡出+滑动+动画+回调+链
隐藏和显示 $(selector).hide(speed,callback); $(selector).show(speed,callback); 可选的 speed 参数规定隐藏/显示的速度, ...
- jQuery 效果 - 隐藏和显示
$('...').hide();//隐藏 $('...').show();//显示 以上使用需要针对特定的功能单独使用,如果是混用,那么就要有标志位去实现,而通常两者更高级的一步到位实现: $('.. ...
- jQuery 效果 – 隐藏和显示
在 jQuery 中可以使用 hide() 和 show() 方法来隐藏和显示 HTML 元素,以及使用 toggle() 方法能够切换 hide() 和 show() 方法. 隐藏.显示.切换,滑动 ...
- jQuery效果--隐藏和显示
jQuery hide() 和 show() 通过 jQuery,您可以使用 hide() 和 show() 方法来隐藏和显示 HTML 元素: $("#hide").click( ...
- jQuery效果-隐藏与显示 小方块的移除
html <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <ti ...
随机推荐
- [geeksforgeeks] Convert a given Binary Tree to Doubly Linked List
http://www.geeksforgeeks.org/in-place-convert-a-given-binary-tree-to-doubly-linked-list/ Given a Bin ...
- 初步体验javascript try catch机制
javascript在ECMAScript3中引入了try catch finally机制,大致原理和其他语言一样. 我们也可以自定义错误事件. 但是事先声明:我们自定义的错误事件,只支持对name. ...
- IE6 png 透明－－四种解决方法
FF和IE7已经直接支持透明的png图了,下面这个主要是解决IE6下透明PNG图片有灰底的 方法一:定义一个样式,给某个div应用这个样式后,div的透明png背景图片自动透明了.(注意两处图片的路径 ...
- HDU4966 GGS-DDU(最小树形图)
之前几天想着补些算法的知识,学了一下最小树形图的朱刘算法,不是特别理解,备了份模板以备不时之需,想不到多校冷不丁的出了个最小树形图,没看出来只能表示对算法不太理解吧,用模板写了一下,然后就过了.- - ...
- POJ 1491
#include<iostream> #include<cmath> #include<iomanip> #define MAXN 50 using namespa ...
- C# 匿名方法 1027
class Program { static void Main(string[] args) { SorAndShowFiles("Sorted by name", delega ...
- 动态调用webservice 接口
1.url:http://localhost:8002/名称.asmx(asmx结尾) 2.需要引用的命名空间:System.Web.Services 3.调用代码: public class Dyn ...
- jstl 的应用 java
JSTL :JSP Standard Tag Library,JSP标准标签库 1.导入包 jstl.jar standard.jar 2.页面中添加标识 <%@taglib uri=" ...
- E文阅读
Lesson 9 A cold welcome 冷遇 What does 'a cold welcome' refer to?On Wednesday evening, we went to the ...
- excel设置下拉菜单，并且不同值会显示不同颜色
工作中常常要用的excel,每次都会有新的需求,然后不会,然后百度,然后过段时间可能就又忘了,于是就想说,自己记录下来~~~因为自己用的都是2010,其实哪个版本都差不多,都是应该可以找到相应的按钮滴 ...