So beschränken Sie das Eingabefeld in HTML auf die Eingabe reiner Zahlen

So beschränken Sie das Eingabefeld in HTML auf die Eingabe reiner Zahlen

Beschränken Sie input Eingabefeld auf reine Zahlen

1、onkeyup = "value=value.replace(/[^\d]/g,'')"

Bei der Verwendung des Ereignisses onkeyup tritt bug auf. Wenn Sie bei der chinesischen Eingabemethode ein chinesisches Zeichen eingeben und dann die Eingabetaste drücken, wird der Buchstabe direkt eingegeben.

2、onchange = "value=value.replace(/[^\d]/g,'')"

Wenn Sie onchange -Ereignis verwenden, wird das Ergebnis nach der Eingabe von Inhalten erst abgerufen, wenn input den Fokus verliert, und es erfolgt keine Reaktion bei der Eingabe.

3、oninput = "value=value.replace(/[^\d]/g,'')"

Die Verwendung oninput Ereignisses löst die beiden oben genannten Probleme perfekt und im Test sind bisher keine weiteren Probleme aufgetreten.

Codebeispiel

<!DOCTYPE html>
<html lang="de">
<Kopf>
    <meta charset="UTF-8" />
    <title>Eingabe</title>
</Kopf>
<Text>
    Ein Eingabefeld, in das nur reine Zahlen eingegeben werden können: <input type="text" name="" oninput="value=value.replace(/[^\d]/g,'')">
</body>
</html>

Dies ist das Ende dieses Artikels darüber, wie Sie das Eingabefeld in HTML auf die Eingabe reiner Zahlen beschränken können. Weitere relevante HTML-Inhalte zum Beschränken der Eingabe auf Zahlen finden Sie in den vorherigen Artikeln von 123WORDPRESS.COM oder in den folgenden verwandten Artikeln. Ich hoffe, Sie werden 123WORDPRESS.COM auch in Zukunft unterstützen!

<<:  Detaillierte Erläuterung der Rolle von overflow:hidden (Überlauf verbergen, Floats löschen, Randkollaps beheben)

>>:  Ein Beispiel für die Implementierung einer einfachen Fingerklick-Animation mit CSS3 Animation

Artikel empfehlen

15 JavaScript-Funktionen, die es wert sind, gesammelt zu werden

Inhaltsverzeichnis 1. Zahlen umkehren 2. Holen Si...

Scrollen von HTML-Marquee-Zeichenfragmenten

Seine Eigenschaften sind wie folgt: Richtung Stell...

Three.js realisiert den dynamischen 3D-Logoeffekt von Facebook Metaverse

Inhaltsverzeichnis Hintergrund Was ist das Metave...

So implementieren Sie mehrere Parameter in el-dropdown in ElementUI

Aufgrund der zunehmenden Anzahl von Schaltflächen...

Was ist SSH? Wie benutzt man? Was sind die Missverständnisse?

Inhaltsverzeichnis Vorwort Was ist SSH? Wofür wir...

Detaillierte Erklärung von JavaScript zur Überwachung von Routenänderungen

Inhaltsverzeichnis Geschichte pushState() Methode...

Tipps zum Mischen von OR und AND in SQL-Anweisungen

Heute gibt es eine solche Anforderung. Wenn die a...

Lösung für das Problem der großen Schriftgröße auf iPhone-Geräten in WAP-Seiten

Wenn Sie keine Javascript-Steuerung verwenden möch...

Flammenanimation mit CSS3 umgesetzt

Ergebnisse erzielen Implementierungscode html <...

So verwenden Sie das MySQL-Limit und lösen das Problem großer Paging-Aufgaben

Vorwort Wenn wir in der täglichen Entwicklung MyS...

Tutorial zum Erstellen eines FTP-Servers in Ubuntu 16.04

Ubuntu 16.04 baut FTP-Server FTP installieren FTP...

Vue-Router-Verlaufsmodus, serverseitiger Konfigurationsprozess-Datensatz

Geschichtsroute Der Verlaufsmodus bezieht sich au...

JS-Dekorationsmuster und TypeScript-Dekoratoren

Inhaltsverzeichnis Einführung in das Decorator-Mu...

Installation verschiedener Versionen von MySQL 8.0.18 und während der Installation aufgetretene Probleme (Zusammenfassung)

Zusammenfassung: Problemlösungsaufzeichnungen von...

Lösen Sie das Problem beim Laden der Vektorkartenquelle in OpenLayers 3

1. Vektorkarte Vektorgrafiken verwenden gerade Li...