Control de introducción de caracteres de un campo de texto con Javascript

05/12/07 - Esto puede ser útil para campos que sólo admitar números o letras.

Por ejemplo, vamos a hacer que en un campo de texto de un formulario sólo se permitan meter números decimales del tipo 9999.99:

Necesitamos una función en JavaScript (por ejemplo):

function fieldNumber (objeto)
{
var valorCampo;
var evento_key = window.event.keyCode;
var numPosPunto = 0;
var strParteEntera = "";
var strParteDecimal = "";
var NUM_DECIMALES = 2;

switch (evento_key)
{
case 48:
case 49:
case 50:
case 51:
case 52:
case 53:
case 54:
case 55:
case 56:
case 57:
case 46:
break;
default:
window.event.keyCode = 0;
return false;
}

valorCampo = objeto.value;
if (evento_key == 46)
if (valorCampo.indexOf(".") != -1)
{
window.event.keyCode = 0;
return false;
}
/* Sólo puede teclear el número de decimales indicado en NUM_DECIMALES */
if ((numPosPunto = valorCampo.indexOf(".")) != -1)
{
strParteEntera = valorCampo.substr(0,(numPosPunto - 1));
strParteDecimal = valorCampo.substr((numPosPunto + 1), valorCampo.length)
if (strParteDecimal.length > (NUM_DECIMALES - 1))
{
window.event.keyCode = 0;
return false;
}
}
return true;
}

Tendremos una página con el formulario y la caja de texto. Tendremos que llamar a la función "fieldNumber" en el evento onkeypress:

<input type="text" name="txtImporte" onkeypress="fieldNumber(this)">

Si tenéis algun problema no dudéis en consultármelo mandándome un mail a iszori@hotmail.com

Autoría, licencia y acciones sobre este artículo

Informe de Ismael Zori* URL: http://www.telefonica.net/web2/izori/ Atención: Copyright. Este artículo no se puede reproducir sin la autorización expresa del autor. * Para consultas técnicas utilizar la lista de correo. Versión imprimible del artículo Enviar artículo por e-mail Publicar un comentario del artículo

Comentarios sin revisar

Añadir un comentario del artículo Entre los comentarios no revisados puede haber algunos interesantes que se hayan enviado recientemente.

 Se han encontrado 2 comentarios sin revisar

Ver los comentarios no revisados

Añadir un comentario del artículo

Enlaces:

Maestrosdelweb

  Ir arriba