El problema que planteamos es:
¿Es posible pasar valores o parámetros entre páginas HTML? Sabemos que es posible si lo hacemos desde una página HTML a una página ASP, PHP, JSP, etc. Existen funciones específicas en estos lenguajes que permiten recuperar valores de variables que llegan a una página de ese tipo a través de una solicitud GET (o POST). Expresiones como
request.getParameter("var1") en ASP o
$_GET['var1'] en PHP son de sobra conocidas por programadores de estos lenguajes.
En consecuencia, el problema planteado se refiere, más concretamente, a si podemos pasar valores de variables entre páginas HTML sin llegar a utilizar ni PHP, ni ASP, etc.
La respuesta es SI. ¿Cómo? Utilizando JavaScript
El mismo tema es tratado en el artículo [ Pasar datos entre páginas ] que proporciona ejemplos adicionales.
Indice.
1.- Empecemos con un ejemplo.
Empezamos por el final.
Para comprobar que realmente funciona el código javascript utilizado nada mejor que verlo realmente en funcionamiento. Podrá usted entonces decidir si vale la pena seguir leyendo el resto de la exposición.
Pequeña explicación.
La demo será realmente simple. Cuando pulse en el siguiente enlace se va a abrir una pequeña ventana. En ella va a aparecer, una página que va mandar datos a una segunda mediante cualquiera de los dos métodos: a través de un enlace o a través de un formulario. La segunda página procesará entonces los datos recibidos y los mostrará en la ventana.
2.- El código del script.
En <HEAD>:
<script type="text/javascript">
function leerGET(){
var cadGET = location.search.substr(1,location.search.length);
var arrGET = cadGET.split("&");
var asocGET = new Array();
var variable = "";
var valor = "";
for(i=0;i<arrGET.length;i++){
var aux = arrGET[i].split("=");
variable = aux[0];
valor = aux[1];
asocGET[variable] = valor;
}
return asocGET;
}
</script>
3.- Explicación del código.
La función leerGET().
Esta función tiene como tarea el procesar la url de la página para determinar los pares variable-valor que contenga y devolvernos esos valores para que puedan ser convenientemente utilizados. Más concretamente, no recibe ningún parámetro y devuelve un array asociativo,
asocGET, que tiene esta forma
asocGET = ( var1:valor1, var2:valor2, ...)
siendo la url de la página, por ejemplo:
http://dominio/pagina.html?var1=valor1&var2=valor2&...
o siendo var1 y var2 datos llegados a traves de un formulario mediante el método GET.
Usar la matriz asociativa asocGET.
Podemos utilizar de varias maneras el valor retornado por la función leerGET. Como por ejemplo la que utilicé en la demo:
<script type="text/javascript">
var paresVarValor = leerGET();
for (obj in paresVarValor){
document.write("'"+obj+"''vale<b>"+paresVarValor[obj]+"</b><br>");
}
</script>
Pero sin duda no es la única. Todo dependerá de lo que se quiera hacer con los pares variable-valor obtenidos.
Lo importante es que una vez llamada a la función y recogido su retorno en una variable (por ejemplo,
var paresVarValor = leerGET(); ), los valores estarán a nuestra disposición (por ejemplo,
paresVarValor['var1'], paresVarValor['var2'], etc.)
4.- Otra posibilidad.
Una simplificación.
Supongamos que no se esté tan interesando en el nombre de las variables y sí en sus valores. Podríamos enviar esos valores en una url de la siguiente forma:
http://dominio/pagina.html?valor1&valor2&...
Es decir, sin escribir var1=, var2=, etc. En ese caso la función leerGET() se va a simplificar bastante.
La función leerGET() simplificada.
Ahora la función va a devolver un array normal a cuyos miembros podremos acceder mediante los índices 0, 1, etc.
<script type="text/javascript">
function leerGET(){
var cadGET = location.search.substr(1,location.search.length);
var arrGET = cadGET.split("&");
return arrGET;
}
</script>
En este caso, una vez llamada a la función y recogido su retorno en unavariable (por ejemplo,
var arrValores = leerGET(); ), los valores estarán a nuestra disposición (por ejemplo,
arrValores[0],arrValores[1], etc.)
Debe quedar claro que esta función simplificada no funcionaría con datos llegados de un formulario mediante el método GET.
