Validar que un campo sea numérico con JavaScript
Validar números en Javascript.
En este Tutorial de Javascript voy a explicar cómo validar que un campo de formulario contenga únicamente números.
Imaginemos que uno de los campos en nuestro formulario pide un número de teléfono, edad, código postal, o cualquier otro campo que se supone debe contener sólo números… la solución para evitar que envíen datos incorrectos, es validar con Javascript que los datos de ese campo sean números…
La validación es tan sencilla que no es necesario crear una función o el uso de expresiones regulares, bastará con esto:
Nota: Reemplaza campo_a_validar por el nombre del campo que será validado.
if(isNaN(f.campo_a_validar.value)) { alert("Error:\nEste campo debe contener solo numeros."); f.campo_a_validar.focus(); return false; }
Ejemplo de uso:
<html>
<head>
<script>
function validacion(f) {
if(isNaN(f.campo_a_validar.value)) {
alert("Error:\nEste campo debe contener solo numeros.");
f.campo_a_validar.focus();
return false;
}
}
</script>
</head>
<body>
<form method="post" action="" onsubmit="return validacion(this)">
Escriba su edad: <input type="text" name="campo_a_validar" value=""><br>
<input type="submit" value="Validar Edad">
</form>
</body>
</html>Espero que el tutorial sea de utilidad, si tienes dudas o sugerencias, deja una respuesta en la caja de comentarios y con gusto intentaré ayudar.
Desde México, DaxMX.
Nota: Tutorial actualizado del original publicado en dasumo.com en Diciembre de 2010.
Respaldar Bases de Datos desde la línea de comandos
Target _blank en enlaces con XHTML Strict
Es mejor guardar el input en una variable declarada asi:
var variable;Luego comprobar si es numerica con un if de esta manera:
if (variable>0)Gracias por compatir tu recomendación esteban, es totalmente correcto del modo como lo explicas.
Sobre decir que «es mejor», habría que hacer un test de rendimiento para comprobarlo.
Un saludo 🙂
Muchas gracias paisano, fue muy util.
Saludos
A lot of thanks for all your hard work on this blog, this piece of javascript worked for my website, thanks a lot
gracias
Te extrañamos Dasumo.
Vamos, regresa ya. Necesitamos tu protección y apoyo, el foro era lo mejor que he conocido, muy humano, todos dispuestos a ayudar y muy activo.
Se te quiere bien y se te extraña mucho.
Cuidate 🙂
Y si quiero que permita los guiones tambien ademas de los números? asi por ej: 4343-3434
Men ponte mas de java scrip saves eres bueno me ayudaste con mi tarea ok cuydate
si tengo varios campos que llenar, por ejm uno con numeros y otro con solo texto…como hago??? ademas que me señale con letras rojas el error.
Gracias
Es un excelente programa
esta muy bien, pero yo quiero que nada mas me permita introducir cinco digitos??? me podrias ayudar,,,,!!!
Hola Luis: en el INPUT del campo coloca lo siguiente: maxlenght="5"
como hacer para q el campo_a_validar sea variable? es decir que se le pueda pasar por parametro a la funcion?:S
Hola,
Puedes agregar el atributo ID al campo y capturar su valor dentro de una función usando document.getElementById, ejemplo:
<input type="text" name="campo" id="campo" value="" /><script>
var ALGO = document.getElementById("campo").value
</script>
Gracias me ha sido de gran utilidad para un script 😉