在手风琴中一次打开一个标签答案

【问题标题】：Open one tab at a time in accordion在手风琴中一次打开一个标签
【发布时间】：2013-03-22 06:25:37
【问题描述】：

我有一个手风琴，它工作得非常好，但我需要的是一次只打开一个标签，这意味着当打开一个标签时，应该关闭另一个标签。

目前你可以看到我们可以通过点击标签链接打开所有的标签。

代码在这里

$("#accordion > li > span").click(function() {
  $(this).siblings("div").slideToggle(250);
        $(this).toggleClass("active");

});

这里是Fiddle

【问题讨论】：

标签： jquery jquery-ui css accordion

【解决方案1】：

LIVE DEMO

$("#accordion > li > span").click(function() {
    $(this).closest('li').siblings().find('span').removeClass('active').next('div').slideUp(250);
    $(this).toggleClass("active").next('div').slideToggle(250);
});

或者像： LIVE DEMO

$("#accordion > li > span").click(function() {
    $(this).toggleClass("active").next('div').slideToggle(250)
    .closest('li').siblings().find('span').removeClass('active').next('div').slideUp(250);
});

【讨论】：

【解决方案2】：

您还可以通过添加beforeActivate 回调来关闭其他手风琴：

$( ".myAccordion" ).accordion({
      collapsible: true,
      active: false,
    heightStyle: "content",
    beforeActivate: function(event, ui) {
   $( ".myAccordion" ).not(this).accordion('option', 'active', false);
}

【讨论】：