miércoles, 15 de septiembre de 2010

jQuery - Agregando parámetros a links existentes

Hace poco me encontré ante un problema en un sitio que estaba trabajando, y era que había muchísimos links, los cuales necesitaban un parametro adicional para evitar el cache de la página.


Se que hay parametros del html para evitar esto, pero los coloque, pero seguía con el mismo problema. Así que me puse a pensar en otra solución.


Al saber que jQuery puede manipular cualquier parte del documento html, me puse a buscar un poco al respecto en la documentación de la librería.


Aquí el código: 


$(function(){          
       $('a[href]').each(function(i){
            var currHref = $(this).attr("href");
                       
                if (currHref.charAt(currHref.length - 1) === '?')                           
                    $(this).attr("href",currHref);
                else if (currHref.indexOf('?') > 0)                
                    $(this).attr("href",currHref+"&rand="+getRandom());
                else                  
                    $(this).attr("href",currHref+"?rand="+getRandom());
     });               
});
  



function getRandom(){
        var randomnumber = Math.floor(Math.random()*10000); 
        return randomnumber;
}

Ahora expliquemos que hace esto.

  • $('a[href]').each(function(i){...Codigo...});
Esta linea de código su función será buscar todos los elementos anchor dentro del documento, e iterar uno por uno. Durante esta iteración es donde se trabajara para agregarle lo que necesitamos.

  • var currHref = $(this).attr("href");
Ahora almacenaremos en una variable el contenido href de nuestro link.

  •  if (currHref.charAt(currHref.length - 1) === '?')
    $(this).attr("href",currHref);
Ahora buscaremos la posición en donde se encuentre el signo "?" si este nos da un valor -1, quiere decir que no tenemos este signo en nuestro link.


  • else if (currHref.indexOf('?') > 0)                
        $(this).attr("href",currHref+"&rand="+getRandom());
     else                  
        $(this).attr("href",currHref+"?rand="+getRandom());

Por último será agregar el parámetro que queremos agregar a todos nuestros links.


Pero que pasa si en los href utilizas javascript:tufuncion(); pues es un hecho que marcaria error el script, para corregir esto, tendríamos que agregar unas cuentas lineas más de código y quedaría solucionado.


Quedaría:



$(function(){                                      
       $('a[href]').each(function(i){
            var currHref = $(this).attr("href");
            var isAfunction = currHref.substring(0,10);              
            if(isAfunction == "javascript"){                
                $(this).attr("href",currHref);
            }else{
                if (currHref.charAt(currHref.length - 1) === '?')                           
                    $(this).attr("href",currHref);
                else if (currHref.indexOf('?') > 0)                
                    $(this).attr("href",currHref+"&randFert="+getRandom());
                else                  
                    $(this).attr("href",currHref+"?randFert="+getRandom());
            }
     });               
});

Lo que esta en negritas seria nuestro nuevo resultado. Solo buscamos la cadena javascript para evitar que concatene en ese anchor, nuestro nuevo parametro.



Encontré un link donde ya estaban trabajando en ese problema.


http://stackoverflow.com/questions/2667551/add-parameter-to-links-on-page-using-jquery


Probé el código que ahí estaban trabajando, pero no funciono.


Espero esto te sirva.

No hay comentarios:

Publicar un comentario