显示所有bootstrap手风琴

我正在尝试编写一个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"); }); }); });