TA貢獻(xiàn)1777條經(jīng)驗(yàn) 獲得超3個(gè)贊
這原本是討論中的手風(fēng)琴jQuery用戶界面文檔：
注意：如果要一次打開(kāi)多個(gè)部分，請(qǐng)不要使用手風(fēng)琴
手風(fēng)琴不允許同時(shí)打開(kāi)一個(gè)以上的內(nèi)容面板，為此需要付出很多努力。如果您正在尋找一種可以打開(kāi)多個(gè)內(nèi)容面板的小部件，請(qǐng)不要使用它。通常，它可以用幾行jQuery代替，如下所示：
jQuery(document).ready(function(){
$('.accordion .head').click(function() {
$(this).next().toggle();
return false;
}).next().hide();
});
或動(dòng)畫(huà)：
jQuery(document).ready(function(){
$('.accordion .head').click(function() {
$(this).next().toggle('slow');
return false;
}).next().hide();
});
“我可能是個(gè)白癡”-如果您不閱讀文檔，那么您不是白癡，但是如果遇到問(wèn)題，通?？梢约涌煺业浇鉀Q方案的速度。
TA貢獻(xiàn)1898條經(jīng)驗(yàn) 獲得超8個(gè)贊
在類似的線程中發(fā)布此內(nèi)容，但認(rèn)為在這里也可能與此相關(guān)。
使用jQuery-UI手風(fēng)琴的單個(gè)實(shí)例來(lái)實(shí)現(xiàn)
正如其他人指出的那樣，Accordion小部件沒(méi)有API選項(xiàng)可以直接執(zhí)行此操作。但是，如果由于某種原因必須使用小部件（例如，您正在維護(hù)現(xiàn)有系統(tǒng)），則可以通過(guò)使用beforeActivate事件處理程序選項(xiàng)來(lái)顛覆和模擬小部件的默認(rèn)行為來(lái)實(shí)現(xiàn)。
例如：
$('#accordion').accordion({
collapsible:true,
beforeActivate: function(event, ui) {
// The accordion believes a panel is being opened
if (ui.newHeader[0]) {
var currHeader = ui.newHeader;
var currContent = currHeader.next('.ui-accordion-content');
// The accordion believes a panel is being closed
} else {
var currHeader = ui.oldHeader;
var currContent = currHeader.next('.ui-accordion-content');
}
// Since we've changed the default behavior, this detects the actual status
var isPanelSelected = currHeader.attr('aria-selected') == 'true';
// Toggle the panel's header
currHeader.toggleClass('ui-corner-all',isPanelSelected).toggleClass('accordion-header-active ui-state-active ui-corner-top',!isPanelSelected).attr('aria-selected',((!isPanelSelected).toString()));
// Toggle the panel's icon
currHeader.children('.ui-icon').toggleClass('ui-icon-triangle-1-e',isPanelSelected).toggleClass('ui-icon-triangle-1-s',!isPanelSelected);
// Toggle the panel's content
currContent.toggleClass('accordion-content-active',!isPanelSelected)
if (isPanelSelected) { currContent.slideUp(); } else { currContent.slideDown(); }
return false; // Cancels the default action
}
});
舉報(bào)