Permitir solo números en input con Javascript

Muchas veces al momento de desarrollar un formulario nos encontramos en la necesidad de crear un campo input que solo nos permita la inserción de números, muchos desarrolladores crean una función en Javascript que valide el campo después del submit del formulario la cual cancele la acción sin consigue que los valores introducidos en el campo contienen alguna letra.

Sin embargo la manera mas elegante de hacer esto es evitar desde el mismo momento que se ingresa el valor que el campo que se teclea sea una letra.

<!DOCTYPE html>
<html lang="es">
<head>
        <meta charset="UTF-8">
        <title>Input Solo numeros</title>
        <script>
                function validar_texto(e){
                    tecla = (document.all) ? e.keyCode : e.which;
 
                    //Tecla de retroceso para borrar, siempre la permite
                    if (tecla==8){
                        return true;
                    }
                     
                    // Patron de entrada, en este caso solo acepta numeros
                    patron =/[0-9]/;
                    
                    tecla_final = String.fromCharCode(tecla);
                    
                    return patron.test(tecla_final);
                }
        </script>
</head>
<body>
        <table>
                <form action="#">
                        <tr>
                                <td><input type="text" placeholder="Ingrese un valor" onkeypress="return validar_texto(event)"></td>
                        </tr>
                </form>
        </table>
</body>
</html>

Tags: