jQuery 效果- 隐藏和显示

最新推荐文章于 2024-07-15 20:12:10 发布

原创最新推荐文章于 2024-07-15 20:12:10 发布 · 205 阅读

0 ·

CC 4.0 BY-SA版权

jQuery 专栏收录该内容

0 篇文章

订阅专栏

这篇博客详细介绍了如何使用jQuery的hide()、show()和toggle()方法来控制HTML元素的可见性。hide()和show()方法允许指定速度参数（如'slow'、'fast'或毫秒）以及完成后执行的回调函数。toggle()方法则用于切换元素的隐藏和显示状态。回调函数的执行时机和方式也在文中进行了说明。

一、通过 jQuery，您可以使用 hide() 和 show() 方法来隐藏和显示 HTML 元素：

// jQuery hide() 和 show()
$("#hide").click(function(){
  $("p").hide();
});
 
$("#show").click(function(){
  $("p").show();
});

$(selector).hide(speed,callback);

$(selector).show(speed,callback);

可选的 speed 参数规定隐藏/显示的速度，可以取以下值：“slow”、“fast” 或毫秒。

可选的 callback 参数是隐藏或显示完成后所执行的函数名称。

二、通过 jQuery，您可以使用 toggle() 方法来切换 hide() 和 show() 方法。显示被隐藏的元素，并隐藏已显示的元素。

$("button").click(function(){
  $("p").toggle();
});

语法：

$(selector).toggle(speed,callback);

可选的 speed 参数规定隐藏/显示的速度，可以取以下值：“slow”、“fast” 或毫秒。

可选的 callback 参数是隐藏或显示完成后所执行的函数名称。

三、对于callback参数的说明

1、$(selector) 选中的元素的个数为 n 个，
对于这里，当 callback 函数加上括号时，函数立即执行，只会调用一次，如果不加括号，元素显示或隐藏后调用函数，则 callback 函数会执行 n 次。

2.callback函数名后加括号，会立刻执行函数体，而不是等到显示/隐藏完成后才执行；

3.callback既可以是函数名，也可以是匿名函数；