Posso expandir / recolher o conteúdo do JQuery ui Accordion clicando em outros elementos também?

Por padrão, existem headers de conteúdo para controlar a expansão / colapso.Mas na minha situação, eu poderia expandir / recolher o conteúdo por outros elementos também. Por exemplo:

a estrutura básica do código de access da jquery ui:

 $(function() { $( "#accordion" ).accordion(); });  

Section 1

Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate.

......

e agora. Eu tenho outros elementos, assim como:

  

Muito obrigado!!

Você pode usar .activate com falso passado para recolher todos os elementos programaticamente. Como você só tem um elemento aberto por vez, isso funcionará para recolher qualquer elemento que esteja aberto mostrando esse link. Isso só funcionará se você tiver collapsible definido como true .

Você pode passar em qual outro elemento você deseja expandir para expandir esse elemento ao clicar.

Guia Acordeão de colapso:

 $('.accordion').accordion('activate', false ); 

Expandir o primeiro separador do acordeão:

 $('.accordion').each(function (idx, item) { if ($(item).accordion("option", "active") === false) { $(item).accordion('activate', 0); } }); 

Após a atualização da interface do usuário do JQuery, não há um método “ativo” no acordeão. Então, para recolher todos os acordeões, use:

 $('.accordion').accordion('option', {active: false}); 

Eu tive problemas para fazer com que os Acordeões entrassem em colapso / se expandissem depois que eles foram carregados inicialmente. Para contornar isso eu usei:

 $('#accordionId h3').click(); 

… que imita o clique na área do header e forçará a alternar as classs de ativação.

Me senti como um hack, mas é o que funcionou, Best.

Usando o Bootstrap:

  //To Expand var elem = $(this).find('.accordionElement'); elem.addClass("in"); elem.attr("style",""); elem.attr("aria-expanded",true); 

então você pode entrar em colapso usando:

  var elem = $(this).find('.accordionElement'); elem.removeClass("in"); elem.attr("style","height: 0px;"); elem.attr("aria-expanded",false);