jquery - 显示所有引导手风琴

Question

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

我有大约 90% 的工作，除了顶部面板表现得很奇怪。当我第一次点击显示时，它会隐藏并且另一个菜单会打开。当来回切换时，尽管它开始正常工作。

我的 jQuery 看起来像这样

$('#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;
});

我已经尝试添加这个，但它没有效果：

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

Answer 1

从这个答案中获取并修改：

$('#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;
});

Answer 2

将 id 添加到您的按钮查看全部并添加脚本：

jQuery(document).ready(function () {
    jQuery('#idButtonViewAll').on('click', function(e){
         jQuery('.accordion-body').each(function(){
               jquery(this).addClass("in");
         });
    });
});