Estoy trabajando con el menú de jQuery Accordion y encontré problemas con la navegación para padres e hijos, y necesito ayuda urgente, gracias

Amplío completamente un menú principal y su secundario, y luego hago clic en el encabezado para que se contraiga. luego amplío otro encabezado, cuando vuelvo a hacer clic en el primer encabezado, el menú secundario no se colapsaba. ¿Hay alguna manera de colapsar todos los encabezados secundarios de un padre cuando se selecciona otro encabezado padre?

Gracias :)

Aquí está mi código

<div id="accordion">
    <h3><a>Link One - First Level</a></h3>
    <div class="accordionSecond">      
        <h6><a href="#">Second Level</a></h6>
        <div class="accordionLink"> 
        <a href="1.html">1.html</a>
        <a href="2.html">2.html</a>
        <a href="3.html">3.html</a>
        <a href="4.html">4.html</a>
        </div>
    </div>

    <h3><a>Link Two - First Level</a></h3>
    <div class="accordionSecond">      
        <h6><a href="#">Second Level</a></h6>
        <div class="accordionLink"> 
        <a href="1.html">1.html</a>
        <a href="2.html">2.html</a>
        <a href="3.html">3.html</a>
        <a href="4.html">4.html</a>
        </div>
    </div>    

</div>   

Aquí hay una pequeña línea de guión

  <script>
  $(document).ready(function() {
    $("#accordion").accordion( {active: true,  collapsible: true, header: "h3", autoHeight: false, navigation: true, event: 'mouseup'}); 
    $(".accordionSecond").accordion( {active: true,  collapsible: true, header: "h6", autoHeight: false, navigation: true,event: 'mouseup'});
  });
  </script>
1
will.i.am 29 dic. 2011 a las 02:15

1 respuesta

La mejor respuesta

Quieres aprovechar el evento changestart del acordeón principal. Aquí, puede colapsar cualquier acordeón infantil:

$("#accordion").accordion({
    active: true,
    collapsible: true,
    header: "h3",
    autoHeight: false,
    navigation: true,
    event: 'mouseup',
    changestart: function (event, ui) {
        ui.oldContent.accordion("activate", false);
    }
});

Usar el método activate y pasarlo false le dice al acordeón que colapse todas las secciones.

Ejemplo: http://jsfiddle.net/p2h8V/

2
Andrew Whitaker 29 dic. 2011 a las 02:32
¿Puedo preguntarte una cosa más? ¿Sabes cómo deshabilitar el enlace una vez que estás en esa página?
 – 
will.i.am
29 dic. 2011 a las 03:22
Creo que encuentro una solución para eso jQuery ("a [href $ = '" + ruta + "']"). removeAttr ('href'); gracias por la ayuda, Andrew.
 – 
will.i.am
29 dic. 2011 a las 03:30
@ user1118445: ¡No hay problema! "Acepta" la respuesta si te ayudó :)
 – 
Andrew Whitaker
29 dic. 2011 a las 03:34