HTML5, Eingabeelement - Teil 2

Bereits im ersten Teil dieses Tutorials haben wir die Attribute definiert, mit denen wir arbeiten können, wir haben gesehen, dass wir einige neue dafür haben HTML5 und andere, die es nicht sind, aber wenn es darum geht, solide Felder aufzubauen, die uns bei den wesentlichen Prozessen der Site helfen, dann hilft uns die Kombination dieser und die richtige Verwendung jedes einzelnen, die bestmöglichen Daten zu sammeln.
Feldgröße einstellen
Wie wir gesehen haben, haben wir zwei Attribute, die sich direkt auf die Größe eines Feldes auswirken, diese sind Größe Ja maximale Länge, regelt einer die visuelle Amplitude des Feldes und der andere die Textmenge, die das Feld tatsächlich empfangen kann.
Sehen wir uns ein Beispiel mit beiden Attributen an:

 Beispiel
Süßkartoffel:

Stadt:
Obst:
Stimme abgeben 

In diesem Beispiel sehen wir, wie das erste Feld angegeben wird a maximale LängeErst damit teilen wir dem Browser mit, dass er nur 10 Zeichen akzeptieren kann, jedoch die Standardbreite zuweisen kann, im zweiten Feld geben wir die an Größe Mit dem, was wir sagen, wie breit es sein soll, schränken wir die Texteingabe jedoch nicht ein und im dritten wenden wir beide Bedingungen an, sehen wir uns an, wie es im Browser funktioniert.

Verwendung von Wert und Platzhalter
Nachdem wir den Unterschied zwischen diesen beiden Feldern gesehen haben, werden wir in diesem Beispiel effektiv demonstrieren, wie sie auf ein Formular angewendet werden. Sehen wir uns an, wie sie im folgenden Code verwendet werden.

 Beispiel
Süßkartoffel:
Stadt:
Obst:
Stimme abgeben 

Wie wir in den ersten beiden Feldern sehen können, gibt der Platzhalter eine Hilfestellung für die Eingabe des Benutzers an. Dieser Wert, den der Platzhalter enthält, ist nicht der Wert des Eingabefelds drittes Feld Es hat bereits etwas im Wertattribut platziert, dies, wenn es beim Absenden an das Formular übergeben würde.
Mal sehen, wie der Browser uns das anzeigen würde

Schreibgeschützte Felder erstellen
Manchmal müssen wir mit schreibgeschützten Feldern arbeiten, entweder weil der Wert vom Benutzer nicht geändert werden soll oder er nur informativ ist. Es kann auch sein, dass es das Ergebnis einer vorherigen Filterung durch den Benutzer ist und nur dieser Wert angezeigt wird, dafür haben wir zwei Optionen, die, obwohl sie gleich erscheinen, völlig unterschiedlich sind.
Das Attribut hatten wir schon gesehen schreibgeschützt und wir wissen, dass das Feld nicht geändert werden kann, wir haben auch das Attribut deaktiviert, hat die gleiche Funktion wie schreibgeschützt, aber beim tun einreichen alle Felder deaktiviert sie werden nicht übermittelt, sodass es so aussieht, als ob sie im Formular nicht vorhanden wäre.
Sehen wir uns das Oben an einem praktischen Beispiel an.

 Beispiel
Süßkartoffel:
Stadt:
Obst:
Stimme abgeben 

Wir können sehen, dass das erste Feld deaktiviert und das zweite schreibgeschützt ist. Wenn das deaktivierte im Browser angezeigt wird, erscheint es mit einer grauen Färbung, die normalerweise mit der Nichtaktivierung verbunden ist, während das schreibgeschützte Feld als normales Feld angesehen wird, obwohl wir es versuchen um jemandem zu schreiben, lässt uns keiner Text eingeben.
Sehen wir uns an, wie das Beispiel aussieht:

Damit beenden wir diesen zweiten Teil des Tutorials, wir sind jetzt in der Lage, unsere Formulare zu verbessern, indem wir grundlegende Validierungen von Größe und Textmenge verwenden und auch steuern, was der Benutzer ändern kann oder nicht, zusätzlich zur Anzeige von Hilfe in den Feldern damit er eine Idee hat, die Sie eingeben sollten oder nicht.Hat dir dieses Tutorial gefallen und geholfen?Sie können den Autor belohnen, indem Sie diesen Knopf drücken, um ihm einen positiven Punkt zu geben