Cómo verificar si href contiene variable

Question

Me gustaría agregar una clase a los enlaces que contienen la variable "activeLink".

La intención es resaltar el enlace activo actualmente, lo que significa el enlace que apunta a donde está el usuario actualmente.

Esto es lo que he intentado:

//This gets the url parameter
function getQueryVariable(variable) {
    var query = window.location.search.substring(1);
    var vars = query.split("&");
    var pair;
    for (var i=0; i<vars.length; i++) {
        pair = vars[i].split("=");
        if (pair[0] == variable){
            return pair[1];
        }
    }
    return false;
}

//This is where it is stored in variable activeLink
var activeLink = getQueryVariable("pagename");

//This is where I am having trouble
$('.nav a').each(function(index, element) {
  if($('.nav a').attr("href") == activeLink) {
    $(this).addClass('active');
  }
});

jquery

3

Jenny 21 ene. 2018 a las 01:11

Answer 1

No es necesario .each en este caso, ya que .find "buscará los descendientes de estos elementos ".

Respuesta basada en la necesidad de solo el nombre de archivo (y opcionalmente la cadena de consulta pero no la url completa)

//var url = 'file://yi/er/san/page.php?page=4'; // use this variable for testing
var url = window.location.href;
var filepath = url.lastIndexOf("/") + 1;
var matchThis = url.substr(filepath);
$('.nav').find("a[href*='"+matchThis+"']").addClass('active');

crédito - https://stackoverflow.com/a/1302339/3377049
respuesta original: página actual de jQuery a través de la función .find () y .each ()

1

Hastig Zusammenstellen 20 ene. 2018 a las 23:00

Answer 2

Puede usar String.prototype.includes() para encontrar si el enlace contiene esa cadena en lugar de es igual a esa cadena.

var activeLink = getQueryVariable("pagename");

$('.nav a').each(function(index, element) {
    if($('.nav a').attr("href").includes(activeLink)) {
        $(this).addClass('active');
    }
});

0

connexo 20 ene. 2018 a las 22:16

Answer 3

Su función parece correcta con pequeños cambios

Probar esto

 $(document).ready(function(){
   var activeLink = getQueryVariable("pagename");
   $('.nav a').each(function(index, element) {
      if($(this).attr("href").indexOf(activeLink) != -1)
         $(this).addClass('active');
   });
  });

0

Alen.Toma 20 ene. 2018 a las 22:29

Cómo verificar si href contiene variable

3 respuestas

Preguntas relacionadas

Nuevas preguntas

jquery