一聚教程网:一个值得你收藏的教程网站

热门教程

jquery 控制div隐藏各种方法总结

时间:2022-06-25 16:53:45 编辑:袖梨 来源:一聚教程网

方法一,利用att根据判断增加class来实现div显示隐藏

原理

我们获取用户点击事件再利用hasClass判断当前是我们定义的隐藏样式不,如果是我们就去了,不是就加上,代码如下

css

 代码如下 复制代码

.listhide{ display:none;}

html


   

 代码如下 复制代码

javascript:void(0);" onClick="ajaxlist(1);" class="xxjd" id="xxjd1">点击我看看

点击我们显示再点击我僦隐藏了

jquery代码

 代码如下 复制代码


方法二利用 hide(),show()实现隐藏与显示

这是jquery自带的方法操作很简单,如

html代码

 代码如下 复制代码

点击我看看

www.111com.net原创文章转注明来源

点击我试一下

隐藏实例

 代码如下 复制代码

$(".xxjd").click(function(){
$('#aa').hide();
})

显示实例

 代码如下 复制代码

$(".xxjdx").click(function(){
$('#aa').show();
})


方法三,利用fadeToggle

 代码如下 复制代码

$(".xxjd").click(function(){
$("#aa").fadeToggle();
})


好了各种各们的jquery隐藏显示div都定了,主要用到hide,show,fadeToggle同时还有taggle()哦,这个就不介绍了。

热门栏目