JavaScript - Convalida, solo numeri

Esistono molte situazioni per consentire l'ingresso di solo numeri o alfabeti, o entrambi sono accettabili nei campi del modulo, a seconda dei requisiti. A tale scopo, convalida i campi in base al requisito utilizzando la convalida JavaScript. Garantisce che l'input dell'utente sia corretto, completo e in base alla necessità o meno prima di inviarlo al server.

Questo post definirà gli approcci per convalidare i campi del modulo per inserire solo numeri.

Convalida JavaScript per inserire solo i numeri

Per convalidare i campi per inserire solo numeri, utilizzare gli approcci di seguito:

• Usando regex
• Usando il metodo isNan ()

Metodo 1: numeri di validazione solo usando un'espressione regolare

Usa il "regolare espressione"O un"Regex modello"Per convalidare i campi del modulo per inserire solo i numeri. Per controllare l'input dell'utente, utilizzare il "incontro()"Metodo con il regex che corrisponde all'input con il modello regex fornito.

Esempio

Nel file HTML, utilizzare il seguente codice per creare un modulo:

Inserisci il tuo numero PIN: AutoComplete = "Off">

Secondo lo snippet di codice sopra:

• Innanzitutto, crea un modulo contenente un campo di input che accetta il numero solo come "Spillo Numero".
• Quindi, crea uno spazio per un messaggio di stampa se l'ingresso non è corretto o corretto utilizzando il

  etichetta.

• Creare un "inviaPulsante "che chiama il"NumberValidationFunc ()"Sul pulsante Fare clic per verificare i campi del modulo.

Utilizzare il seguente codice in ""Tag o file JavaScript:

funzione NumberValidationFunc ()

var input = document.getElementById ("pinnumber").valore;
var pattern = /^[0-9]+$ /;
if (input.match (pattern))

documento.getElementById ("Errore").InnerHtml = "Great";
restituire vero;

altro

documento.getElementById ("Errore").InnerHtml = "Immettere valore numerico";
restituire false;

Qui, nello snippet sopra:

• Innanzitutto, definisci una funzione chiamata "NumberValidationFunc ()"Verrà invocato sul clic del pulsante.
• Ottieni il valore di input usando "valore"Attributo.
• Crea un modello regex memorizzato in una variabile "modello".
• Quindi, verifica se l'input corrisponde al modello usando "incontro()" metodo.
• Se l'input corrisponde allo schema, stampare il messaggio "Grande", Altrimenti, visualizza il messaggio di errore"Immettere il valore numerico".

Come puoi vedere, l'output accetta solo i numeri mentre si inserisce numeri con alfabeti non è accettabile e mostra un messaggio di errore:

Metodo 2: numeri di convalida solo usando il metodo isNan ()

Puoi anche usare il “isnan ()"Metodo per la convalida dei campi per inserire solo i numeri. Ci vuole input come argomento e controlla se l'input è un numero che fornisce "VERO"Altro, dà"falso".

Esempio

Definire una funzione "NumberValidationFunc ()"Ciò chiamerà l'evento OnClick del pulsante di invio per verificare se l'ingresso è un numero o meno"isnan ()" metodo:

funzione NumberValidationFunc ()

var input = document.getElementById ("pinnumber").valore;
if (isnan (input))

documento.getElementById ("Errore").InnerHtml = "Immettere valore numerico";
restituire false;

altro

documento.getElementById ("Errore").InnerHtml = "Great";
restituire vero;

Produzione

Si tratta solo di convalida dei numeri solo in JavaScript.

Conclusione

Per convalidare i campi di testo del modulo solo per valori numerici, utilizzare il "espressione regolare"Come schemi di regex o"isnan ()" metodo. Entrambi gli approcci sono i migliori per convalidare solo i numeri e puoi scegliere/scegliere uno in base al tuo desiderio. Questo post ha definito gli approcci per convalidare i campi del modulo per inserire solo numeri.