0

Tengo el siguiente menú de arranque

HTML

<div class="container">
  <ul class="nav navbar-nav">

    <li class="active">

        <a href="#" data-toggle="collapse" data-target=".menu-nav" class="collapsed drop-down" aria-expanded="false">Link1<span class="caret"></span></a>

        <ul id="menu-nav" class="nav menu-nav collapse" aria-expanded="false">

          <li> <!-- tambien agrega active -->

            <a href="javascript:;" class="collapsed" data-target=".menu-navs" data-toggle="collapse" aria-expanded="false">Sub Link1<span class="caret"></span></a>

            <ul id="menu-nav" class="nav menu-navs collapse" aria-expanded="false">

              <li> <!-- tambien agrega active -->

                <a href="javascript:;" class="collapsed" data-target=".menu-navss" data-toggle="collapse" aria-expanded="false">Sub1 Link1<span class="caret"></span></a>

                <ul id="menu-nav" class="nav menu-navss collapse" aria-expanded="false">

                  <li><p>Test Ok</p></li>

                </ul>

              </li>

            </ul>

          </li>

        </ul>

    </li>

    <li><a href="#">Link2</a></li>
    <li><a href="#">Link3</a></li>

  </ul>

</div>

¿cómo puedo alterar el agrego de la "< li >" clase de activo cuando se hace clic en cualquiera del < li > ?

La siguiente no está funcionando para mí

$("li").on("click",function(){
  $(".nav navbar-nav li").removeClass("active");
  $(this).addClass("active");
});

Ejemplo

introducir la descripción de la imagen aquí

https://jsfiddle.net/cs7qw44n/#&togetherjs=8rQckJ7ICy

5
  • ¿casa o trabajo? No aparecen de esa forma.
    – Rene Limon
    Commented el 27 dic. 2016 a las 18:18
  • trabajo, por que no? Commented el 27 dic. 2016 a las 18:19
  • me refiero a que tu pregunta dice ¿cómo puedo alterar el cambio de la "< li >" clase de activo cuando se hace clic en cualquiera de casa o del trabajo? pero no hay ninguna etiqueta que diga casa o trabajo
    – Rene Limon
    Commented el 27 dic. 2016 a las 18:21
  • me equivoque. solo se hace clic en cualquier de <li> Commented el 27 dic. 2016 a las 18:25
  • El título de la pregunta parece un telegrama y a mi me parece difícil de comprender. Commented el 6 abr. 2017 a las 5:23

2 respuestas 2

1

Puedes Probar

$(function() {
  
  // elementos de la lista
  var menues = $(".nav li"); 

  // manejador de click sobre todos los elementos
  menues.click(function() {
     // eliminamos active de todos los elementos
     menues.removeClass("active");
     // activamos el elemento clicado.
     $(this).addClass("active");
  });

});

0

Amigo siempre van a quedar con la clave Active los que están abiertos. ya que si le quitas el activo se cerrara automáticamente por motivos del bootstrap.

la única forma de que se visualice sin la clase active es que no uses las clases de bootstrap y dispares el menu con jquery UI que seria open.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.