3

我想折叠 div onclick 事件，在另一次单击时想折叠 div

我的 jquery 正在关注

$(".fold_reply").click(function() {

    if ($('.reply').css('display', 'none')) {
        $(".reply").show("fold", {}, 500);
    }
    else {
        $(".reply").hide("fold", {}, 500);
    }

});​

我要折叠的 div 在初始点有 display:none

在我的回复标签 < div class="reply" style="display:none; " > 在最初的回复没有显示

所以当我点击然后 div 向下折叠但在其他 div 上它没有折叠
请帮助我

4

5 回答 5

5 
$(".fold_reply").click(function() {
    $(".reply").toggle(500)
}

Toggle 将根据元素的当前状态显示或隐藏元素，从而消除您的 if 块。

检查这个小提琴的例子：

http://jsfiddle.net/z9rGz/3/

于 2012-10-27T09:39:16.243 回答
4

是的@levib 答案简短而正确。另一种选择是您可以使用 slideUp() 和 slideDown() 函数。

$(".fold_reply").click(function() {

    if ($('.reply').css('display', 'none')) {
        $(".reply").slideDown("slow");
    }
    else {
        $(".reply").slideUp("fast");
    }

});​
于 2012-10-27T09:58:55.880 回答
3

您应该使用执行此操作的jquery.toggle或jquery UI.toggle方法。

但是你逻辑中的错误是$('.reply').css('display', 'none'). 这将设置display为none。它不检查它是否none...

如果您必须使用该代码，则应将其更改为

if ( $('.reply').css('display') === 'none') )
于 2012-10-27T09:38:02.750 回答
1

使用 jQueryUI 版本，toggle()因为您似乎正在使用 jQuery UI 效果

.toggle( 效果 [, 选项 ] [, 持续时间 ] [, 完成 ] )

参考：http ://api.jqueryui.com/toggle/

$(".fold_reply").click(function() {
     $(".reply").toggle("fold",  500);
})
于 2012-10-27T09:48:02.700 回答
0 
$(".fold_reply").click(function() { 
     var style=$('.reply').css('display');
    if (style=='none') {
        $(".reply").show(500);
    }
    else {
        $(".reply").hide(500);
    }

});​

<input type="button" class='fold_reply' value="button">

<div class='reply'>
    text<br/>text<br/>text<br/>text<br/>text
</div>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

工作演示

于 2012-10-27T09:39:03.243 回答