Jquery 引导折叠的隐藏方法将显示折叠元素

下面是一个简单的例子：

单击调整大小按钮，使方框div变大

再次单击按钮，使其恢复正常大小。但是，您将看到不应显示的折叠元素

我想这是因为这句话：

$（“div.inbox”）。折叠（“隐藏”）；

此行的目的是：如果用户单击

a

标记以显示折叠元素，则当他们收缩

box div

时，折叠元素将被隐藏

奇怪的是，这个问题只会在第一次单击

resize

按钮时发生。我不知道为什么会发生这种情况。

无论发生什么情况，“show”都像是第一次发生坍塌（）火灾。简单的解决方案是检查是否显示了.inbox，如果是，则触发collapse（'hide'）。我们可以通过检查是否添加了类“in”来获取元素的状态-.collapse=element hidden、.collapse.in=element show

$("button.resize").click(function(){
    var isExpanded = !$("div.box").hasClass("expanded");
    $("div.box").toggleClass("expanded", isExpanded);
    if ($("div.inbox").hasClass("in")) {
        $("div.inbox").collapse('hide');
    }
});

---

在元素上调用折叠插件时，如果尚未初始化，则会触发初始化进程（请参阅）

默认情况下，init进程切换元素（隐藏时显示，可见时隐藏）-相当于

.collapse（'toggle'）

您需要首先初始化可折叠元素，禁用toggle on init参数（请参阅）：

请参见您的

$（“div”）.collapse（“show”）； 美元（“div”）。折叠（“隐藏”）

在我的场景中，我确实希望在初始隐藏后切换。所以我用了这个：

$thingToCollapse.collapse({ 'toggle': false }).collapse('hide');

---

在尝试了许多大部头之后，我以：

来源 .折叠隐藏内容 。在转换期间应用折叠 .collapse.in显示内容

//隐藏

if ($('#div').hasClass("in")) {$(#div).removeClass('in');}

//展示

$('#div').addClass('in');

---

为我工作

非常感谢。顺便说一下，在我的应用程序中，

box div

是由

ajax

动态生成的。什么是正确的启动方式？@Harrison在ajax过程中，通常是在它被创建之后，但是你应该看看周围，肯定有人已经问过这个问题了

$('#div').addClass('in');