jQuery显示与隐藏效果

来源：互联网发布：嫁コレ数据提取资料编辑：程序博客网时间：2024/05/21 13:21

有滑动的效果的

通过使用滑动效果，在显示和隐藏状态之间切换 <p> 元素：

<html><head><script type="text/javascript" src="/jquery/jquery.js"></script><script type="text/javascript">$(document).ready(function(){  $(".btn1").click(function(){  $("p").slideToggle();  });});</script></head><body><p>This is a paragraph.</p><button class="btn1">Toggle</button></body></html>

定义和用法
slideToggle() 方法通过使用滑动效果（高度变化）来切换元素的可见状态。
如果被选元素是可见的，则隐藏这些元素，如果被选元素是隐藏的，则显示这些元素

语法
$(selector).slideToggle(speed,callback);
参数描述
speed
可选。规定元素从隐藏到可见的速度（或者相反）。默认为 “normal”。
可能的值：
毫秒（比如 1500）
“slow”
“normal”
“fast”
在设置速度的情况下，元素在切换的过程中，会逐渐地改变其高度（这样会创造滑动效果）。
callback
可选。toggle 函数执行完之后，要执行的函数。
如需学习更多有关 callback 的内容，请访问我们的 jQuery Callback 这一章。
除非设置了 speed 参数，否则不能设置该参数。

没有滑动效果的
切换

元素的显示与隐藏状态：

<html><head><script type="text/javascript" src="/jquery/jquery.js"></script><script type="text/javascript">$(document).ready(function(){  $(".btn1").click(function(){  $("p").toggle();  });});</script></head><body><p>This is a paragraph.</p><button class="btn1">Toggle</button></body></html>

定义和用法
toggle() 方法切换元素的可见状态。
如果被选元素可见，则隐藏这些元素，如果被选元素隐藏，则显示这些元素
语法
$(selector).toggle(speed,callback,switch)；
参数描述
speed
可选。规定元素从可见到隐藏的速度（或者相反）。默认为 “0”。
可能的值：
毫秒（比如 1500）
“slow”
“normal”
“fast”
在设置速度的情况下，元素从可见到隐藏的过程中，会逐渐地改变其高度、宽度、外边距、内边距和透明度。
如果设置此参数，则无法使用 switch 参数。
callback
可选。toggle 函数执行完之后，要执行的函数。
如需学习更多有关 callback 的内容，请访问我们的 jQuery Callback 这一章。
除非设置了 speed 参数，否则不能设置该参数。
switch
可选。布尔值。规定 toggle 是否隐藏或显示所有被选元素。
True - 显示所有元素,在点击可能无法再次隐藏。
False - 隐藏所有元素,在点击可能无法再次此显示。
如果设置此参数，则无法使用 speed 和 callback 参数。

**提示和注释
注释：该效果适用于通过 jQuery 隐藏的元素，或在 CSS 中声明 display:none 的元素（但不适用于 visibility:hidden 的元素）。**

阅读全文

0 0