Bootstrap可摺疊的組可以作爲手風琴

我使用的手風琴從here的例子，我試圖讓它擴大多個或單個面板，由用戶選擇，通過添加2個按鈕，其中，使用jquery，刪除屬性'data-parent'或者再次添加。Bootstrap可摺疊的組可以作爲手風琴

這是我實現here

所有的工作就是這樣完成的：

$('#expandSingle').on('click', function() { 
    $('.accordion-toggle').attr('data-parent', '#accordion'); 
}); 

$('#expandMulti').on('click', function() { 
    $('.accordion-toggle').removeAttr('data-parent'); 
});

的怪異的是，如果我手動（無jQuery的），刪除「數據父'刷新，我得到我想要的結果，小組成爲全部可摺疊的。當我通過頁面上的jQuery進行操作時，它有奇怪的行爲，但不起作用...

任何想法請嗎？

來源

2016-03-01 cnom

它不起作用，因爲崩潰組件已經使用#accordion作爲data-parent初始化。

您可以重新初始化組件和重置數據屬性這樣的..

$('#expandSingle').on('click', function() { 
    $('.panel-collapse').removeData('bs.collapse'); 
    $('.panel-collapse').collapse({parent:'#accordion'}); 
}); 

$('#expandMulti').on('click', function() { 
    $('.panel-collapse').removeData('bs.collapse'); 
    $('.panel-collapse').collapse({parent:false}); 
});

演示：http://bootply.com/dSZVY2hphO

來源

2016-03-01 16:01:02 ZimSystem

非常感謝！唯一的問題是，在expandMulti上，它會切換所有面板（反轉所有展開的展開），我認爲我通過在摺疊函數中添加了toggle：false來克服了這個問題 – cnom

基於斯凱利的回答，我改進它有點像：

$('#expandSingle').on('click', function() { 
    $('.panel-collapse').removeData('bs.collapse'); 
    $('.panel-collapse').collapse({parent:'#accordion', toggle:false}); 
}); 

$('#expandMulti').on('click', function() { 
    $('.panel-collapse').removeData('bs.collapse'); 
    $('.panel-collapse').collapse({parent:false, toggle:false}); 
});

我剛剛在collapse（）上添加了toggle：false選項，所以當我從Single切換到Multi時，擺脫了這種煩人的切換。

演示：http://www.bootply.com/8EZ1WjgxSX

來源

2016-03-02 10:16:01 cnom

Bootstrap可摺疊的組可以作爲手風琴

回答

相關問題