Heim > Web-Frontend > HTML-Tutorial > So beschränken Sie das HTML-Eingabefeld auf reine Zahlen

So beschränken Sie das HTML-Eingabefeld auf reine Zahlen

醉折花枝作酒筹
Freigeben: 2021-04-25 09:21:38
nach vorne
3204 Leute haben es durchsucht

In diesem Artikel erfahren Sie, wie Sie das Eingabefeld in HTML auf reine Zahlen beschränken. Es hat einen gewissen Referenzwert. Freunde in Not können sich darauf beziehen. Ich hoffe, es wird für alle hilfreich sein.

onkeyup = "value=value.replace(/[^\d]/g,'')"
Nach dem Login kopieren

Bei Verwendung des onkeyup-Ereignisses liegt ein Bug vor, d. h. im chinesischen Eingabemethodenstatus, wenn Sie chinesische Zeichen eingeben und direkt die Eingabetaste drücken, Die Buchstaben werden direkt eingegebenonkeyup 事件,有 bug ,那就是在中文输入法状态下,输入汉字之后直接回车,会直接输入字母

onchange = "value=value.replace(/[^\d]/g,'')"
Nach dem Login kopieren

使用 onchange 事件,在输入内容后,只有 input 丧失焦点时才会得到结果,并不能在输入时就做出响应

oninput = "value=value.replace(/[^\d]/g,'')"
Nach dem Login kopieren

使用 oninput

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <title>input</title>
    </head>
    
    <body>
    只能输入纯数字的输入框:<input type="text" name="" oninput="value=value.replace(/[^\d]/g,&#39;&#39;)">
    </body>
    </html>
Nach dem Login kopieren
Bei Verwendung des onchange-Ereignisses wird das Ergebnis nach der Eingabe von Inhalten nur dann erhalten, wenn input den Fokus verliert und während der Eingabe nicht reagiert werden kann

rrreee

Das oninput -Ereignis löst die beiden oben genannten Probleme perfekt, und im Test sind bisher keine weiteren Probleme aufgetreten.

Codebeispielrrreee

Empfohlenes Lernen: 🎜HTML-Video-Tutorial🎜🎜

Das obige ist der detaillierte Inhalt vonSo beschränken Sie das HTML-Eingabefeld auf reine Zahlen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:csdn.net
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage