Bootstrap將手風琴保持在同一高度

Question

當用戶單擊另一個摺疊面板時，我試圖使Bootstrap手風琴保持在相同的高度。如果內容變得太大，pannel應該點擊空格來獲得手風琴的全部高度，並使pannel內容可以滾動。這裏有一個fiddle！

var header = $('.panel-heading'); 
var test = $(window).height() - (header.length*$('.panel-heading').height()); 
$('.panel-body').height(test); 

Answer 1

我已經編輯你的CSS，HTML和JS ..我不知道該怎麼用jQuery做到這一點，所以我用普通的JavaScript：

var header = document.getElementsByClassName('panel-heading'); 
var headingheights = header.length * (header[0].offsetHeight + 18); 
var test = $(window).height() - headingheights; 
$('.panel-body').height(test); 

注： 所有Panelbodys必須具有相同的填充，所以我將自己的列表包裹在自己的div中，邊距爲-15px（與您的解決方案效果相同）

我在小提琴中添加了一些註釋供您解釋...; ）

看看這個小提琴：https://jsfiddle.net/hhcpuequ/11/

我希望這是你要搜索的內容;）