Validar solo números o letras en JavascriptPublicado el 26 octubre, 2013. (1432 vistas)4 comentarios

Compartir:

Compartir

Desde que fui trasladado al área de desarrollo de sistemas donde laboro he estado algo

ocupado desarrollando unos proyectos y eso ha hecho que tenga menos tiempo para

publicar tutoriales, pero por el contrario he aprendido algunas cosas en php, jQuery y

Javacript que estaré publicando en la brevedad posible, una de las cosas que aprendi es a

validar un campo de texto para permitir ingresar solo los datos que necesitemos.

Este primer código es para validar solo letras y  lo pegan antes de la etiqueta de cierre

head (</head>)

123456789101112131415

<script type="text/javascript">  function validarLetras(e) { // 1    tecla = (document.all) ? e.keyCode : e.which;     if (tecla==8) return true; // backspace    if (tecla==32) return true; // espacio    if (e.ctrlKey && tecla==86) { return true;} //Ctrl v    if (e.ctrlKey && tecla==67) { return true;} //Ctrl c    if (e.ctrlKey && tecla==88) { return true;} //Ctrl x     patron = /[a-zA-Z]/; //patron     te = String.fromCharCode(tecla);     return patron.test(te); // prueba de patron  } </script>

En la variable “tecla” guardo el código numérico de la tecla que se presiona en el teclado

(valga toda la redundancia), como pueden notar en los comentarios también tengo

permitido la utilización de otro tipo de teclas como la barra espaciadora o la combinación

de Ctrl+v entre otros. Luego esta el patrón que es donde valido en sí que solo quiero letras

en mi campo de texto, si se presiona una tecla diferente a la del patrón entonces regresa

false y no permite “dibujar” el caracter en el campo de texto.

El siguiente código sería el ejemplo de como debe quedar el control input en tu html,

debemos agregar el evento “onkeydown”, que dispara el evento cada vez que se presiona

una tecla, y llamar a la función para validar letras.

1 <input type="text" name="letras" id="letras" onkeydown="return validarLetras(event)"/>

Para validar solo números podemos utilizar este otro código de javascript:

12345678

<script type="text/javascript">  function validarNumeros(e) { // 1    tecla = (document.all) ? e.keyCode : e.which; // 2    if (tecla==8) return true; // backspace    if (tecla==109) return true; // menos    if (tecla==110) return true; // punto    if (tecla==189) return true; // guion    if (e.ctrlKey && tecla==86) { return true}; //Ctrl v

9101112131415161718

    if (e.ctrlKey && tecla==67) { return true}; //Ctrl c    if (e.ctrlKey && tecla==88) { return true}; //Ctrl x    if (tecla>=96 && tecla<=105) { return true;} //numpad     patron = /[0-9]/; // patron     te = String.fromCharCode(tecla);     return patron.test(te); // prueba  }</script>

Este es muy similar al primero, solo que agrego otro tipo de validaciones como el punto,

guiones y las teclas del numpad en caso de escribir los números desde ahí. El código del

campo de texto sería como este:

1 <input type="text" name="num" id="num" onkeydown="return validarNumeros(event)"/>

Si queren saber como permitir más teclas utilizando el KeyCode o código numérico de la

tecla este sitio tiene una lista completa de las teclas: Javascript char codes.

Solo numeros

1. <script language="javascript" type="text/javascript">2.     3.     function Solo_Numerico(variable){4.         Numer=parseInt(variable);5.         if (isNaN(Numer)){6.             return "";7.         }8.         return Numer;9.     }10.     function ValNumero(Control){11.         Control.value=Solo_Numerico(Control.value);12.     }13. </script>14.  15. Cedula: <input type=text name=Cedula onkeyUp="return ValNumero(this);"

maxlength="8" size="20" />