Paso de parametros en HTML con client-side Javascript

Se trata de un sencillo script Javascript para recoger los parámetros que le llegan a una página.
El script siguiente se colocará "a pelo" en la página que debe de recibir los parametros, o podrá copiarse en un fichero .js vinculado. En ambos casos el código no debe estar en ninguna función, para que se ejecute siempre que se carga la página. Una vez se haya ejecutado el script tendremos los valores recibidos en las correspondientes variables. Aquellas que no hayamos recibido tendrán el valor por defecto que hamos fijado.

El Código:
<script language="javascript">
//Autor: Bruno Suárez Laffargue
//Version: 1.1

//Definimos las variables necesarias
variable=unValorPorDefecto;//Habrá que establecerlo

//Capturamos la URL
var callingURL = document.URL;

//Separamos los parametros
var cgiString = callingURL.substring(callingURL.indexOf('?')+1,callingURL.length);

//Fijamos el sepador entre parametros
var DELIMETER = '&';

//Eliminamos la almohadilla, si es que existe... cortamos por lo sano!
if (cgiString.indexOf('#')!=-1){
    cgiString=cgiString.slice(0,cgiString.indexOf('#'));
}

//Troceamos el cgiString ya limpiado, separando cada par variable=valor
//en una de las posiciones del array
var arrayParams=cgiString.split(DELIMETER);

//Recorremos el array de parametros evaluando cada uno de los pares variable=valor
for (var i=0;i<arrayParams.length;i++){
    eval(arrayParams[i].substring(0,arrayParams[i].indexOf('=')+1)+"\""+
    arrayParams[i].substring(arrayParams[i].indexOf('=')+1,arrayParams
     [i].length)+"\"");
}
</script>


Una de las restricciones funcionales para que esto funcione es tener tantas variables javascript definidas como parametros se van a recibir, inicializadas a un valor por defecto. Además estas variables han de llamarse exactamente igual que los parametros, ya que si no, no funciona. En ningún caso.

Autor

Bruno Suárez Laffargue

Analista/Programador

Compartir

Comentarios

David Martinez

07/10/2004
yo hace tiempo hice este script para recibir varibales por URL sin tener lenguage servidor, y esta amplia las posibilidades del script anterior, el cual esta muy bien, dado que nunca se me ocurrio trabajar las variables mediante array, lo cual me hubiera facilitado el trabajo, jeje, pero lo buenos es que esta funciona muy similar a la de los lenguages servidor al poder llamar a una funcion y obtener la variable que se necesita solamente, y poder llamarla en cualquier parte del documento. Anexo Script

<script language=javascript>
function obtvarurl(name_var){
name_var=new String(name_var)
var urlactual
var longurl, longvar, valorvar= new String()
var ctractual, longvaractual, varactual= new String()
urlactual= window.location //leemos la direccion url actual
urlactual= new String(urlactual) //convertimos la variable en una clase string para obetener acceso a sus metodos
longurl=urlactual.length //almacemanos en esta variable la cantidad de caracateres que contiene la urlactual
longvar=name_var.length //almacenamos en esta variable la cantidad de caracteres que ocupa el nombre de la variable solicitada
for (i = 1; i < (longurl+1); i++) //iniciamos la busqueda del contenido de la variable solicitada por parametro
{ctractual=urlactual.substring(i,i+1) //evaluamos un caracter hasta que este sea igual a ? o &
if (ctractual=="?" || ctractual=="&") //si el caracter es ? o & significa que viene el nombre de una variable
{
varactual=urlactual.substring(i+1,i+longvar+1) //extraemos a una variable a partir del caracter ? o & la cantidad de caracteres de la variable solicitada por parametro
if (varactual.toLocaleUpperCase() == name_var.toLocaleUpperCase()) //evaluamos si la variable extraida es igual a la solicitada por parametro
{
longvaractual=urlactual.indexOf("&",i+longvar+2)//extraemos la longitud del contenido de la variable solicitada
if (longvaractual<0) // evaluamos si la longitud del valor a extraer es menor a cero
{longvaractual=longurl} //si la longitud es menor a cero significa que es la ultima variable
valorvar=urlactual.substring(i+longvar+2,longvaractual) //extraemos el contenido de la variable
}
}
}
valorvar=unescape(valorvar) //eliminamos los caracteres especiales %20 etc y lo convertimos a valores ASCII
return valorvar //devolvemos el contenido de la variable solicitada
}

Saludos
David

Jesús Navarrete

21/10/2004
Hola, He utilizado el script para una web html, pero probando en distintos navegadores, sólo funcionaba en el mozilla, y poniendo unas trazas he averiguado que la línea:

var callingURL = document.URL;

debería ser sustituida, por lo que he leido, URL no está en todos los navegadores, es mejor usar location, aunque al final he usado location.href, de la otra forma me daba problemas en los dos que he estado probando, así que quedaría:

var callingURL = document.location.href;

y funciona de maravilla en mozilla 1.7.3 y explorer 6.0.2800.1106.

Un saludo y felicidades al autor.

jorge perez

11/1/2005
saben ke no entiendo como funciona el script lo revise pero no tengo idea de como puedo ocupar esas variables obtenidas, es mas ni sikiera he podido (despues de un par de horas tratando), cargar las variables ke le mando de otra pagina, pero bueno creo ke este script esta bastante complejo para mi podria talvez haber una ejemplificacion para usuarios como yo ke somos lentos... saludos

carlos

24/1/2005
a ver que os parece esta función que me he hecho yo.
Le pasas el nombre del parámetro y te coge devuelve el valor, es algo parecido a un request.getParameter de JSP pero para JS.

Funciona en iexplorer y mozilla


function obtenerParametro(nombreParametro){
var parametro=window.location.search.split(nombreParametro+'=')[1];
parametro= parametro.split('&')[0];
return parametro;
}

Jesús Esteiner Alonso

19/7/2005
Hola todos,

Estuve probando la verdad lo que comentaban y no me funciono, sin embargo pude lograrlo de la siguiente manera:

function ObtenerP(nParametro)
{
//Capturamos la URL
var callingURL = document.location.href;

//Separamos los parametros
var cgiString = callingURL.substring(callingURL.indexOf('?')+1,callingURL.length);

// Para manejar control ya que el arreglo empieza en cero restaremos 1 al parametro recibido
nParametro -=1;

// Dividimos mediante la función split los parámetros separados por ampersam
var col_array=cgiString.split("&");
var part_num=0;

// Ahora hacemos un recorrido del arreglo y buscamos el # de parametro solicitado!
while (part_num < col_array.length)
{ if ( part_num == nParametro )
return col_array[part_num];
else
part_num+=1;
}

// evaluar que devolver cuando no lo
// encuentra...
return 0;
}

La idea es tener separado tan solo por & ampersand o el caracter que escojan luego se llama por el # de parametro,

ObtenerP(1);

Regresará el valor de la primera instancia,

Saludos!

Swanyta

25/9/2006
Estos scripts parecen una buena solución...Sugiero que lo complementen con un ejemplo para que los 'menos expertos' nos sea más fácil comprenderlo...

Swanyta

25/9/2006
Estos scripts parecen una buena solución...Sugiero que lo complementen con un ejemplo para que los 'menos expertos' nos sea más fácil comprenderlo...

César Santis

07/2/2008
Gracias... me salvó la vida el código...

Guille

08/9/2010
Paso de parametros en HTML con client-side Javascript
Estoy aprendiendo a hacer páginas Web y el script funciona de maravillas.
Hay que estudiarlo un poquito, pero una vez que lo entiendes es muy simple.
Felicitaciones al autor.
Muchas Gracias por la ayuda.

Martin R.Jurado

20/9/2012
gracias !
prefecto ! ( le hice el cambio de Jesus )
Anda 10 puntos en los 5 fundamentales :
IE (grrrr)
Safari
Chrome
Opera
Mozilla