Validar solo nmeros o letras en Javascript

Publicado 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 cdigo es para validar solo letras y lo pegan antes de la etiqueta de cierre head (</head>)
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 <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 cdigo numrico de la tecla que se presiona en el teclado (valga toda la redundancia), como pueden notar en los comentarios tambin tengo permitido la utilizacin de otro tipo de teclas como la barra espaciadora o la combinacin de Ctrl+v entre otros. Luego esta el patrn que es donde valido en s que solo quiero letras en mi campo de texto, si se presiona una tecla diferente a la del patrn entonces regresa false y no permite dibujar el caracter en el campo de texto. El siguiente cdigo sera 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 funcin para validar letras.
1 <input type="text" name="letras" id="letras" onkeydown="return validarLetras(event)"/> <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 if (e.ctrlKey && tecla==67) { return true}; //Ctrl c if (e.ctrlKey && tecla==88) { return true}; //Ctrl x

Para validar solo nmeros podemos utilizar este otro cdigo de javascript:
1 2 3 4 5 6 7 8 9 10

11 12 13 14 15 16 17 18

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 nmeros desde ah. El cdigo del campo de texto sera como este:
1 <input type="text" name="num" id="num" onkeydown="return validarNumeros(event)"/>

Si queren saber como permitir ms teclas utilizando el KeyCode o cdigo numrico 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" />