Validar sólo números o Texto con JavaScript

En la mayoría de las veces, es necesario validar en una aplicación que caracteres introduce el usuario en un campo de texto, como por ejemplo: solo letras para la captura de Nombres y apellidos o solo números en diferentes navegadores para un teléfono o validar sólo números y letras.

Validar Textbox en C# para que acepte solo números, lo podemos lograr a través del siguiente código JavaScript, mostrado a continuación:

Validar sólo números
Esta función nos permite identificar a través de la propiedad event.keyCode la tecla digitada. Si el caracteres digitado no se encuentra dentro del rango de teclas numéricas (del 48 al 57) retorna falso (no permite escribir el caracter), como lo muestra el siguiente código:
//Función que permite solo Números
function ValidaSoloNumeros() {
 if ((event.keyCode < 48) || (event.keyCode > 57)) 
  event.returnValue = false;
}

Luego, para llamar la función en nuestra pagina web, solo basta con invocarlo en el evento onkeypress de la caja de texto así:

Validar sólo Texto o Letras

A diferencia del código anterior, éste nos permite digitar sólo texto, letras mayúsculas (del 65 al 90) y minúsculas (del 97 al 122) así:
function txNombres() {
 if ((event.keyCode != 32) && (event.keyCode < 65) || (event.keyCode > 90) && (event.keyCode < 97) || (event.keyCode > 122))
  event.returnValue = false;
}

Llamamos la función en el evento onkeypress de la caja de texto:


Si queremos que los códigos anteriores, no estén incluidos dentro de la pagina web, podemos crear un archivo .js llamado Validaciones.js, luego copiamos y pegamos el código anterior en este archivo, guardamos y finalmente agregamos la siguiente línea, arriba del tag </head> , de la pagina donde se desee llamar la función:

Espero los pueda ayudar, cualquier duda me escriben por este post o a mi  correo, hasta pronto.
"" Si tienes dudas o quieras ampliar este artículo, lo puedes hacer dejando tus comentarios. Además, si lo consideras interesante puedes compartirlo con amigos y seguidores a través de los botones sociales que aparecen en esta página.""


Share:

39 comentarios:

  1. Excelente me sirvió muchísimo.!!!

    ResponderEliminar
  2. Hola! sabes el codigo para la validación de texto no me sirve, e intentado de todo y nada, trabajo con symfony.
    necesito ayuda!

    ResponderEliminar
  3. Hola,
    Si quieres enviame el codigo que tienes con el error a mi correo y lo revisamos.

    Hasta pronto.

    ResponderEliminar
  4. El ValidarSoloNumeros no funciona en firefox

    ResponderEliminar
  5. no me funciona en Mozilla Firefox

    ResponderEliminar
  6. tremenda pagina chica... me ayudo mucho... gracias =3!

    ResponderEliminar
  7. sirve pero igual deja }{}{{++¿¿¿||°°°°° nesesito solo letras

    ResponderEliminar
  8. Y como puedo que tmb la "ñ" la detecte como letra?

    ResponderEliminar
  9. con jquery mesclando seria:

    $("#numero").keypress(function(event){
    if (event.keyCode < 48 || event.keyCode > 57) {
    return false;
    }
    });

    ResponderEliminar
  10. Hola excelente aporte TheOneProgrammer, lo tendremos en cuenta.

    ResponderEliminar
  11. Amigo porque no corre en mozilla
    hice la prueba pero solo en google chrome funciona jejee
    De todos modos buen aporte mereces un 10

    ResponderEliminar
  12. amigo excelente me sirvió de mucho...

    ResponderEliminar
  13. como hago para que funcione en mozilla tambn?

    ResponderEliminar
  14. Muchas Gracias me ayudo mucho ! (:

    ResponderEliminar
  15. saludos, hey el codigo no funciona, probe como lo colocaste y nada

    ResponderEliminar
  16. El más simple que encontré. Muchas Gracias

    ResponderEliminar
  17. Excelente aporte el tuyo, miles de gracias...

    leí varios sitios web pero este fué el mejor, más facil, saludos.

    ResponderEliminar
  18. Podrías enviarme un tutorial donde muestre los input de forma dinámica, es decir, a traves de un select, yo elijo una opcion, y dependiendo de esa opcion, quiero que me muestre un input ya sea solo letras o solo números.

    ResponderEliminar
  19. Gracias! me sirvió mucho :D

    ResponderEliminar
  20. si me sirvio pero al enviarlo no m muestra nada

    ResponderEliminar
  21. Diego, me alegra te halla servido.

    ResponderEliminar
  22. Para que funcione en FireFox:

    function ValidaSoloNumeros(event) {
    var code =event.charCode || event.keyCode;
    if ((code< 48) || (code> 57)){
    if(window.event){
    event.returnValue = false;
    }else{
    event.preventDefault();
    }

    }
    }

    ResponderEliminar
  23. Muy valioso tu aporte Anónimo, para todos se comparte, saludos.

    ResponderEliminar
  24. Buen artículo de mucha utilidad, gracias por la info. Un saludo.

    ResponderEliminar
  25. me ayudo mucho gracias!

    ResponderEliminar
  26. Gracias por tu comentario anónimo.

    ResponderEliminar
  27. como podría hacer que la función de solo números igual acepte guiones ??

    ResponderEliminar
  28. Anónimo dentro de la funcion incluye el caracter Ascci Decimal 45 que corresponde al Guion (-).

    Espero te sirva, hasta pronto.

    ResponderEliminar
  29. gracias. simple y muy bueno...

    ResponderEliminar
  30. Una pregunta muy buena validacion pero quiero que la tecla tab este habilitada para poder pasar de un lado a otro el codigo que tengo esta así:
    Auqmente para que este habilitada la tecla de eliminar y quise habilitar de la misma forma el TAB pero no funcionó
    AYUDA PORFAVOR:
    function soloNumeros(e){
    var key = window.Event ? e.which : e.keyCode
    return ((key >= 48 && key <= 57) || (key == 8)|| (key == 9));
    }

    ResponderEliminar
  31. Me sirvió mucho este tutorial, gracias por el aporte

    ResponderEliminar
  32. Muchas gracias Haz sido de gran ayuda!!!!

    ResponderEliminar
  33. A ti Alex mauricio, por tu comentario.

    Saludos

    ResponderEliminar
  34. Hola, una consulta. Y como se podria limitar el numero de numeros a 5 por ejemplo, en este mismo ejemplo?
    saludos

    ResponderEliminar
  35. Hola anónimo la siguiente Url te puede ayudar con los codigos ASCII: http://www.ascii-code.com/

    El numero 5 esta representado por el event.keyCode = 53

    Espero te sirva, saludos

    ResponderEliminar