Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

254
Vistas
jQuery agregar clase .active en el menú

Tengo un problema.

Quiero agregar la clase "activa" en el menú de elementos cuando la página relativa está activada.

el menú es muy sencillo:

 <div class="menu"> <ul> <li><a href="~/link1/">LINK 1</a> <li><a href="~/link2/">LINK 2</a> <li><a href="~/link3/">LINK 3</a> </ul> </div>

En jQuery necesito verificar si la url es www.xyz.com/other/link1/

si es este, me gustaría agregar una clase, el elemento 'a' de link1.

Estoy probando muchas soluciones pero nada funciona.

over 4 years ago · Santiago Trujillo
3 Respuestas
Responde la pregunta

0

Haga clic aquí para una solución en jsFiddle

Lo que necesita es obtener window.location.pathname como se mencionó y luego crear expresiones regulares a partir de él y probarlo con hrefs de navegación.

 $(function(){ var url = window.location.pathname, urlRegExp = new RegExp(url.replace(/\/$/,'') + "$"); // create regexp to match current url pathname and remove trailing slash if present as it could collide with the link in navigation in case trailing slash wasn't present there // now grab every link from the navigation $('.menu a').each(function(){ // and test its normalized href against the url pathname regexp if(urlRegExp.test(this.href.replace(/\/$/,''))){ $(this).addClass('active'); } }); });
over 4 years ago · Santiago Trujillo Denunciar

0

Una forma más fácil para mí fue:

 var activeurl = window.location; $('a[href="'+activeurl+'"]').parent('li').addClass('active');

porque mis enlaces van a una URL absoluta, pero si sus enlaces son relativos, puede usar:

 window.location**.pathname**
over 4 years ago · Santiago Trujillo Denunciar

0

Obtenga los elementos LI, recorra, verifique el HREF:

 $('.menu').find('a').each(function() { if($(this).attr('href').indexOf('www.xyz.com/other/link1/')>0) { $(this).addClass('active'); } })
over 4 years ago · Santiago Trujillo Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda