Conversor pesetas - euros

Si quieres ofrecer servicios de valor añadido a tus visitantes, este sencillo conversor de euros a pesetas es una buena manera de empezar.

En qué consiste

Para usar esta calculadora, simplemente introduce una cantidad en la casilla correspondiente (la izquierda si dicha cantidad está en euros o la derecha si es en pesetas). Luego pulsa el botón situado al lado contrario y la cantidad convertida aparecerá.

Cómo realizarlo

Como suele ocurrir en estos casos, esta pequeña aplicación se puede dividir en dos partes, la incluida en las etiquetas HTML y las funciones Javascript. Vamos a empezar por lo primero:

<form name="conversor">
<table border=0>
<tr>
  <td><input type="text" name="euros"> euros</td>
  <td><input type="text" name="pesetas"> pesetas</td>
</tr>
<tr>
  <td><input type="button" value="<< Convertir a euros"
        onClick="convertirAEuros()"></td>
  <td><input type="button" value="Convertir a pesetas >>"
        onClick="convertirAPesetas()"></td>
</tr>
</table>
</form>

Lo primero que hay que resaltar es que tanto la etiqueta FORM como los dos campos de texto tiene definido el parámetro NAME . Esto nos permitirá, en el código Javascript, hacer referencia a las mismas cómodamente, llamándolos por su nombre. Vemos también que se realizan llamadas a funciones Javascript en ambos botones, una función para convertir a euros y otra para convertir a pesetas. Estas son:

var euro = 166.386;

function convertirAEuros() {
  document.conversor.euros.value =
    Math.round(parseInt(document.conversor.pesetas.value) * 100 / euro)
    / 100;
}

function convertirAPesetas() {
  document.conversor.pesetas.value =
    Math.round(parseInt(document.conversor.euros.value) * euro);
}

Es ahora cuando se ve la necesidad de bautizar a nuestro formulario y nuestras cajas de texto. Vamos a analizar en detalle la primera función, ya que la segunda es casi equivalente. Consta sólo de una asignación de un valor a document.conversor.euros.value . ¿Y eso qué es? Mirémoslo detenidamente, leyéndolo de izquierda a derecha. Lo primero que encontramos es el objeto document , que hace referencia a la página HTML actual. Dentro de dicha página (seguimos leyendo) accedemos al formulario llamado conversor y, dentro del mismo, al elemento del formulario llamado euros (en nuestro caso, una caja de texto). Por último, el value indica que el valor que deseamos alterar es el atributo value , que alberga el contenido actual de la caja de texto.

Usuarios que han visto este tema también han visto...

- Un sólo cambio para modificar múltiples páginas con JavaScript
- Pequeños trucos de JavaScript
- Menú barra horizontal con botones para desplazar
- Música en la página con Javascript
- Validación de formularios usando JavaScript

- Versión imprimible de este documento

- Enviar por e-mail este documento