jQuery效果——显示和隐藏

来源：互联网发布：怎样用手机注册淘宝店编辑：程序博客网时间：2024/05/16 08:47

jQuery可以通过hide()来隐藏，用show()来显示

语法：

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

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

可选的 callback 参数是 toggle() 方法完成后所执行的函数名称。

<!DOCTYPE html><html><head><script src="/jquery/jquery-1.11.1.min.js"></script><script type="text/javascript">$(document).ready(function(){  $("#hide").click(function(){  $("p").hide(1000);//规定隐藏/显示的速度，可以取值："slow"、"fast" 或毫秒。  });$("#show").click(function(){  $("p").show(1000);  });});</script></head><body><button type="button" id="hide">隐藏</button><button type="button" id="show">显示</button><p>这是一个段落。</p><p>这是另一个段落。</p></body></html>
结果：

点击按钮会出现隐藏或显示的结果

可以使用 toggle() 方法来切换 hide() 和 show() 方法。

语法：

$(selector).toggle(speed,callback);
可选的 speed 参数规定隐藏/显示的速度，可以取以下值："slow"、"fast" 或毫秒。
可选的 callback 参数是 toggle() 方法完成后所执行的函数名称。
<!DOCTYPE html><html><head><script src="/jquery/jquery-1.11.1.min.js"></script><script type="text/javascript">$(document).ready(function(){  $("button").click(function(){  $("p").toggle(1000);  });});</script></head><body><button type="button">切换</button><p>这是一个段落。</p><p>这是另一个段落。</p></body></html>

结果：

点击按钮会出现效果

0 0