Números solo de entrada en JavaScript
Este artículo demostrará los métodos para ingresar solo números en JavaScript.
Cómo ingresar solo números en JavaScript?
Puede ingresar solo números en JavaScript optando por los siguientes enfoques:
- "Ascii" Conjunto de caracteres
- "jQuery"
Los conceptos mencionados se demostrarán uno por uno!
Método 1: Números solo de entrada en JavaScript usando un conjunto de caracteres ASCII
Este procedimiento se puede utilizar para aplicar una condición sobre la representación ASCII de los números en el campo de entrada.
Ejemplo
En el siguiente ejemplo, incluya el "IDENTIFICACIÓN"Eso debe ingresarse en el campo de entrada. Además, especifique el campo de entrada como un "texto"E invoca la función inputNumber () mientras pasa el evento como un argumento cuando"OnKeyPress"El evento se activa:
A continuación, defina una función llamada "número de entrada()"Eso acepta"numer"Como argumento. En la definición de la función, aplique la condición sobre los números representados en ASCII de tal manera que si el código ASCII es mayor que "31"Y menos que"48" o "57", Significa que se ingresa un carácter no número en el campo de entrada. En tal caso, se generará una alerta pidiendo al usuario que ingrese solo números:
función inputNumber (num)var asciiCode = (num.cual) ? numer.cual: num.clave
if (asciiCode> 31 && (asciiCode 57))
alerta ("Ingrese solo números")
Se puede ver que cuando se escribe un personaje en el campo de entrada, aparece un cuadro de alerta con la siguiente información:
La siguiente tabla explica el concepto discutido de representación ASCII para números según el requisito:
| Representación ascii | Dígitos |
|---|---|
| 48 | 0 |
| 49 | 1 |
| 50 | 2 |
| 51 | 3 |
| 52 | 4 |
| 53 | 5 |
| 54 | 6 |
| 55 | 7 |
| 56 | 8 |
| 57 | 9 |
La única limitación al método anterior es que todavía acepta la entrada no número de números del usuario después de mostrar la advertencia. Para resolver este problema, consulte el siguiente método!
Método 2: Números de entrada solo en JavaScript usando jQuery
Este enfoque se puede implementar incluyendo la biblioteca "jQuery" y aplicándola al campo de entrada con la ayuda de una expresión regular para detectar los valores no numéricos y reemplazarlos con una cadena vacía.
Mire el siguiente ejemplo para comprender el concepto declarado.
Ejemplo
Primero, incluya la siguiente biblioteca jQuery para aplicar sus funcionalidades:
A continuación, agregue un encabezado con el ""Etiqueta y campo de entrada usando el""Etiqueta dentro de la etiqueta central para alinearlos en el centro. Aquí, limitaremos la longitud del campo de entrada a "4" utilizando el "longitud máxima"Atributo ya que es un pin de 4 dígitos:
Ingrese el PIN de 4 dígitos:
Ahora, aplique el "jQuery"Función en el campo de entrada con el"/[^0-9]/g" expresión regular. Esta expresión regular verifica si el valor de los tipos no está en un personaje "^", reemplácelo con un carácter vacío:
$ (function ()$ ("Entrada [name = 'numonly']").on ('input', function (e)
$ (esto).Val ($ (esto).val ().reemplazar (/[^0-9]/g, "));
);
);
En este ejemplo, hemos restringido el campo de entrada para aceptar solo un carácter numérico de 4 dígitos del usuario:
Hemos implementado los métodos en el campo de entrada a los números de entrada solo en JavaScript.
Conclusión
Para ingresar solo números en JavaScript, hemos implementado el "Ascii"El enfoque de establecimiento de personajes y el"jQuery"Técnica. El enfoque de conjunto de caracteres ASCII se puede utilizar para aplicar una condición al campo de entrada que verifica el carácter ASCII del carácter ingresado. Mientras que la técnica jQuery se usa junto con la expresión regular para aplicar una verificación en el campo de entrada creado. Este artículo demostró los métodos para ingresar solo números en JavaScript.