jQuery教程：点击显示和隐藏示例

发布时间：2024-01-05  栏目：建站知识   浏览：   分类：js教程 jquery教程

jQuery点击显示隐藏示例教程：首先，引入jQuery库。然后，使用`$("选择器").click(function(){...})`为元素添加点击事件。在事件处理函数中，使用`$("#元素ID").toggle()`实现点击切换元素的显示和隐藏。例如，当点击一个按钮时，显示或隐藏一个段落。具体操作如下： 1. 引入jQuery库； 2. 为按钮添加点击事件； 3. 在事件处理函数中，使用`$("#段落ID").toggle()`实现点击切换段落的显示和隐藏。 这样就可以实现一个简单的jQuery点击显示隐藏效果。

jQuery显示隐藏语法

隐藏元素：hide()

示例：

$("#test").hide(1000);

显示元素：show()

示例：

$("#test").show();

切换显示隐藏：toggle()

显示被隐藏的元素，并隐藏已显示的元素

示例：

$("#test").toggle();$("#test").animate({height:'toggle'});

点击显示隐藏示例

$('.wdzzz').click(function(){if($(".wdzzzcom").is(':hidden')){$('.wdzzzcom').show().end();}else{$('.wdzzzcom').hide().end();}});

释义：点击.wdzzz元素，判断.wdzzzcom是否隐藏，如果真就show()，如果假就hide()