显示所有bootstrap手风琴 | 显示所有bootstrap手风琴

本文介绍了显示所有bootstrap手风琴的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我正在尝试为自举式手风琴编写一个链接，该链接将在单击时显示所有手风琴面板，然后在再次单击时将隐藏所有面板.

I'm trying to program a link for bootstraps accordion that will show all the accordion panels when clicked and then when clicked again all the panels hide.

除了顶部面板运行异常之外，我大约有90％正常工作.当我第一次单击显示时，它将隐藏并打开另一个菜单.来回切换后，它开始按预期方式工作.

I have it about 90% working, except the top panel is acting weird. When I click on the show all the very first time it will hide and the other menu's open up. When toggled back and forth though it starts to work as it should.

我的jQuery看起来像这样

My jQuery looks like this

$('#accShow').on('click', function() {
    if($(this).text() == 'View All') {
        $(this).text('Hide All');
        $('.collapse').collapse('hide');
    } else {
        $(this).text('View All');
        $('.collapse').collapse('show');
    }
    return false;
});

并且我尝试添加它，但是没有效果:

and I have tried adding this, but it had no effect:

$('#collapseOne').collapse("show");

推荐答案

获取并修改:

$('#accShow').on('click', function() {
    if($(this).text() == 'View All') {
        $('.collapse:not(.in)').each(function (index) {
            $(this).collapse("toggle");
        });
        $(this).text('Hide All');
    } else {
        $(this).text('View All');
        $('.collapse.in').each(function (index) {
            $(this).collapse("toggle");
        });
    }
    return false;
});

这篇关于显示所有bootstrap手风琴的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！