Webdesign-Tipps für Formular-Eingabefelder
|
Dieser Artikel listet einige Tipps und Codes zu Formular-Eingabefeldern im Webdesign auf. 1. Gestricheltes Feld, wenn die Abbrechen-Schaltfläche gedrückt wird <br /> Fügen Sie den Attributwert hideFocus oder HideFocus=true in die Eingabe ein 2. Schreibgeschützter Textfeldinhalt Fügen Sie der Eingabe den Attributwert readonly hinzu 3. Verhindern Sie, dass das TEXT-Dokument nach dem Zurückgehen gelöscht wird (der Stilinhalt kann als Klassenreferenz verwendet werden). <INPUTstyle=verhalten:url(#default#savehistory);Typ=textid=oPersistInput> 4. Die ENTER-Taste bewegt den Cursor zum nächsten Eingabefeld <inputonkeydown="wenn(event.keyCode==13)event.keyCode=9"> 5. Nur Chinesisch (blinkt) <inputonkeyup="Wert=Wert.replace(/[-~]/g,'')"onkeydown="wenn(event.keyCode==13)event.keyCode=9"> 6. Nur Zahlen (blinkend) <inputonkeyup="Wert=Wert.replace(/[^/d]/g,'')"onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^/d]/g,''))"> 7. Nur Zahlen (kein Blinken) <inputstyle="ime-mode: disabled"onkeydown="wenn(event.keyCode==13)event.keyCode=9"onKeyPress="wenn((event.keyCode<48||event.keyCode>57))event.returnValue=false"> 8. Nur Englisch und Zahlen können eingegeben werden (mit Blinken) <inputonkeyup="Wert=Wert.replace(/[/W]/g,'')"onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^/d]/g,''))"> 9. Blockeingabemethode <inputtype="text"name="url"style="ime-mode:disabled"onkeydown="wenn(event.keyCode==13)event.keyCode=9"> 10. Es können nur Zahlen, Dezimalpunkte und Minuszeichen (-) eingegeben werden (kein Blinken) <inputonKeyPress="wenn(event.keyCode!=46&&event.keyCode!=45&&(event.keyCode<48||event.keyCode>57))event.returnValue=false"> 11. Es können nur zwei Dezimalstellen oder drei Dezimalstellen eingegeben werden (blinkt) <inputmaxlength=9onkeyup="wenn(value.match(/^/d{3}$/))value=value.replace(value,parseInt(value/10));value=value.replace(//./d*/./g,'.')"onKeyPress="wenn((event.keyCode<48||event.keyCode>57)&&event.keyCode!=46&&event.keyCode!=45||value.match(/^/d{3}$/)||//./d{3}$/.test(value)){event.returnValue=false}"id=text_kfxename=text_kfxe> |
<<: Docker-Port-Mapping und externe Unzugänglichkeitsprobleme
>>: CSS zum Erzielen eines Beispielcodes für eine Bildlaufleiste
Artikel empfehlen
Was macht der legendäre VUE-Syntax-Sugar?
Inhaltsverzeichnis 1. Was ist syntaktischer Zucke...
So verwenden Sie Nginx, um die Koexistenz mehrerer Container auf dem Server zu realisieren
Hintergrund Es gibt einen Tencent Linux Cloud-Hos...
CocosCreator klassisches Einstiegsprojekt flappybird
Inhaltsverzeichnis Entwicklungsumgebung Game-Engi...
25 Möglichkeiten und Tipps zur Verbesserung der Ladegeschwindigkeit von Webseiten
Einführung <br />Nicht jeder hat Zugang zu e...
Detaillierte Schritte zur Implementierung der Timeout-Statusüberwachung in Apache FlinkCEP
CEP – Komplexe Ereignisverarbeitung. Die Zahlung ...
Implementierung von erzwungenen Zeilenumbrüchen und Nicht-Zeilenumbrüchen in div, td, p und anderen Containern in HTML
1. Erzwingen Sie keinen Zeilenumbruch und beenden ...
So sperren Sie eine virtuelle Konsolensitzung unter Linux
Wenn Sie an einem gemeinsam genutzten System arbe...
Ein Beispiel für die Implementierung einer einfachen Endlosschleifen-Scrolling-Animation in Vue
Dieser Artikel stellt hauptsächlich ein Beispiel ...
Analyse der geplanten Aufgaben und Ereignisplanungsbeispiele von MySQL
Dieser Artikel beschreibt anhand von Beispielen d...
Beispiel für die Methode „Mysql implementiert Nullwerte zuerst/letzten“
Vorwort Wir wissen bereits, dass MySQL den SQL-Be...
Überlegungen zum Rasterdesign von Webseiten
<br />Ursprüngliche Adresse: http://andymao....
Verwenden von CSS3 und JavaScript zum Entwickeln von Beispielcode für die Web-Farbauswahl
Die Web-Farbauswahlfunktion in diesem Beispiel ve...
Beispielcode zur Implementierung der Formularvalidierung mit reinem CSS
In unserem täglichen Geschäft ist die Formularval...
Beispiel für die Implementierung einer nahtlosen Endlosschleife im Hintergrund mithilfe einer CSS-Animation
1. Nachfrage Ein Bild bewegt sich in einer Endlos...
Docker-Installation von RocketMQ und Lösungen für während der Installation aufgetretene Probleme
Inhaltsverzeichnis Ziehen Sie das Rocketmq-Image ...