Satz von HTML-Formularen. HTML-Formulare. Mehrzeiliges Textfeld – Tag

Hallo, liebe Leser der Blogseite. Im weiteren Verlauf betrachten wir die Formular- und Eingabe-Tags mit ihren Attributen (), mit denen Sie eine Vielzahl von Formularen für die Site erstellen können.

Unabhängig vom Thema und Inhalt einer bestimmten Webressource enthält sie höchstwahrscheinlich Formulare in der einen oder anderen Form: Textfelder, Dropdown-Menüs, verschiedene Schaltflächen oder Schalter. Übrigens habe ich in einer der Veröffentlichungen bereits über Elemente gesprochen, die zur Diversifizierung der Formen beitragen.

Was ist der praktische Zweck all der Vielfalt möglicher Formen? Sie werden zunächst benötigt, um die vom Benutzer eingegebenen Daten an den Server zu senden und dort mit einem speziell erstellten Skript (Handler) weiterzuverarbeiten.

HTML-Formulare – wie sie mithilfe von Formularen und Eingaben erstellt werden

Wie ich eingangs sagte, muss auf jeder mehr oder weniger entwickelten Website eine Art Webformular vorhanden sein, oder sogar mehrere gleichzeitig. Um zu verstehen, wie wichtig sie im Hinblick auf die Konformität einer Webressource mit modernen Anforderungen sind, genügt es, Ihnen nebenbei drei Objekte zu nennen, die Formulare verwenden, die auf den Formular- und Eingabe-Tags basieren und die allein durch ihren Namen keinen Zweifel an ihrer Gültigkeit lassen Notwendigkeit für ein Projekt in die eine oder andere Richtung:

Wenn Sie beispielsweise einem Link zu einem Artikel über das Erstellen von Feedback folgen (damit alle Benutzer Nachrichten an die Site-Administration senden können), dann wird der HTML-Code mit einem Formular, das eine Öffnung hat (

) und schließen (
) Teil:


Hier spielt das Formular eine entscheidende Rolle, da es die Installation des Webformulars initiiert. Es stellt selbst keinen Bereich auf einer Webseite dar, sondern dient als Container, der andere Tags enthält.

In unserem Fall (siehe Screenshot oben) sind dies mehrere Eingang(Dieses HTML-Tag ist einzeln, hat also keine schließende Komponente) und auch Textbereich, mit unterschiedlichen Attributsätzen. Jeder von ihnen definiert sein eigenes Element, das im Formular enthalten ist.

16. Autofokus(keine Parameter) ist ein logisches Attribut, das beim Laden der Webseite sofort den Fokus auf das Feld setzt, sodass Sie Daten eingeben können, ohne darauf klicken zu müssen. Kann nicht nur auf den Eingabetyp „versteckt“ angewendet werden.

17. Deaktiviert(ohne Werte) – deaktiviert für den Benutzer das Formularelement, zu dem es hinzugefügt wurde. Am häufigsten wird es in Verbindung mit Skripten verwendet, in denen Bedingungen angegeben werden, unter denen ein unzugängliches Element aktiviert wird.

18. Bilden– Ordnet das Element dem Formular zu, wenn es sich außerhalb des Containers befindet

. Zum Verknüpfen wird dem Formular-Tag ein globales ID-Attribut und dem Eingabe-Tag ein Formularattribut hinzugefügt, dessen Werte gleich sind (z. B. id = „data“ und form = „data“). .

19. Mehrere(keine Parameter) – setzt Multiple-Choice-Option für den Benutzer und wird nur in Verbindung mit type="file" und type="email" verwendet.

Wenn Sie das Datei-Upload-Feld verwenden, können Sie mit der Strg- oder Umschalttaste mehrere Dateien gleichzeitig von Ihrem Computer auswählen. Wenn ein Feld zur Eingabe einer E-Mail-Adresse angezeigt wird (type="email"), sollten E-Mails durch Kommas getrennt eingegeben werden.

20. Erforderlich(keine Werte) – aktiviert die Anforderung, dass der Benutzer Daten eingeben muss. Daher blockiert der Browser die Übermittlung des Webformulars, wenn ein erforderliches Feld leer bleibt, und zeigt eine entsprechende Meldung über die Notwendigkeit an, dieses auszufüllen.

Dieses Attribut wird nicht für Grafik- und Standardschaltflächen (type="button | image") sowie für ausgeblendete Eingabefelder (type="hidden") verwendet.

21. Größe— bestimmt die Breite des Textfelds in Zeichen (nur für Typelemente mit den Parametern „E-Mail | Passwort | Suche | Tel | Text | URL“ geeignet). Der Standardwert beträgt 20 Zeichen.

Die nächsten vier Attribute (22-25) für das Eingabe-Tag haben fast die gleiche Funktionalität wie für , der Vollständigkeit halber werde ich sie jedoch auch kurz erwähnen.

22. Maximale Länge– legt eine Begrenzung der maximalen Anzahl von Zeichen fest, die beim Ausfüllen eines Textfelds eingegeben werden können. Wenn Sie versuchen, diese Grenze zu überschreiten, werden weitere Eingaben blockiert. Dieses Attribut gilt nur für Textelemente mit dem Typ „E-Mail | Passwort | Suche | Tel. | Text | URL“.

23. Minimale Länge– legt eine Begrenzung der Mindestanzahl von Zeichen fest, die in den Textbereich eingegeben werden müssen. Wenn versucht wird, Daten mit weniger Zeichen zu senden, erscheint eine kurze Meldung, die auf die Notwendigkeit hinweist, den Inhalt des Formulars zu ergänzen, und es werden Informationen über die Anzahl der bereits eingegebenen Zeichen bereitgestellt. Die Nutzungsbedingungen sind genau die gleichen wie bei maxlength.

24. Platzhalter— Sie können einen Hinweis (der als Parameter dient) direkt im Textfeld platzieren, der verschwindet, sobald der Benutzer mit der Zeicheneingabe beginnt. Nur für Felder, die über Parameter gebildet werden E-Mail, Passwort, Suche, SMS, Tel., URL Typattribut des Eingabe-Tags.

25. Schreibgeschützt(keine Parameter) – zeigt an, dass der zuvor in das Feld eingegebene Text nur zum Lesen und Kopieren verfügbar ist. Es wird normalerweise in Verbindung mit Skripten verwendet, in denen Bedingungen angegeben werden, die bei Erfüllung dieses Formularelement aktivieren können.

Und zum Schluss noch ein paar Attribute, die die Funktionalität verschiedener Formularelemente ergänzen:

26. Muster— spiegelt als Wert einen regulären Ausdruck wider, auf dessen Grundlage die Regeln für die Eingabe von Informationen festgelegt werden. In diesem Fall empfiehlt es sich, zusätzlich ein globales Titelattribut hinzuzufügen, als Parameter können Sie erläuternden Text hinzufügen, der Benutzern beim Ausfüllen der Felder hilft. Das Muster wird nur auf E-Mail-, Passwort-, Such-, Text-, Tel.- und URL-Elemente angewendet. Lassen Sie es uns anhand eines Beispiels verstehen. Hier ist der Code für ein vereinfachtes Anmeldeformular (mit ):

Anmeldung

Passwort

Anmeldung

Passwort

Für das Anmeldefeld (type="text") wird als Musterwert ein regulärer Ausdruck (5,) angegeben, der die Verwendung lateinischer Zeichen impliziert, wobei mindestens fünf Zeichen eingegeben werden müssen.

Bezogen auf den Textbereich für das Passwort (type="password") wird der Wert auf (8,) gesetzt, was die Eingabe von in jedem Fall ausschließlich lateinischen Zeichen (Groß- und Kleinbuchstaben) sowie Zahlen, Dabei sollte die Gesamtzahl aller Zeichen nicht weniger als acht betragen.

Bei Verstößen gegen die angegebenen Eingabebedingungen lässt der Browser das Senden von Daten nicht zu und zeigt eine entsprechende Warnung an:


27. Src— Definiert den Pfad zum Bild (URL, das ist sein Wert) für die Anzeige der Grafikschaltfläche „Bild“ (siehe Tabelle der Eingabetypparameter oben).

28. Schritt– legt den Schritt für Elemente fest, die eine Auswahl an numerischen Werten bieten (Eingabetyp="Datum | Datum/Uhrzeit-Lokal | Monat | Zahl | Bereich | Tel. | Zeit | Woche").

Als Parameter kann jede beliebige Ganzzahl oder Bruchzahl verwendet werden. Standardschritt = „1“. Um den endgültigen Eingabebereich festzulegen, können Sie erneut die oben erwähnten Min- und Max-Attribute verwenden. Aus Gründen der Übersichtlichkeit werden wir 2 Elemente type="number" in das Testformular aufnehmen. Setzen Sie für den ersten Schritt „2“ und für den zweiten Schritt „0,1“:

Geben Sie einen Wert zwischen 0 und 1 ein:

Geben Sie einen Wert zwischen -10 und 10 ein:

Geben Sie einen Wert zwischen 0 und 1 ein:

29. Wert– legt den Wert des Formularelements fest, das an den Handler übergeben wird. Ein Name-Parameter-Paar wird an den Server gesendet, wo der Name durch das Namensattribut des Eingabe-Tags und der Parameter durch das Wertattribut bestimmt wird. Darüber hinaus für verschiedene Formelemente Der Wert wird unterschiedliche Rollen spielen:

  • for type="button | reset | subscribe" – legt die Textbeschriftung auf den Schaltflächen fest;
  • for type="checkbox | radio | image" – identifiziert jedes Kontrollkästchen, jeden Schalter oder jede grafische Schaltfläche beim Senden und Verarbeiten von Daten auf dem Server;
  • für type="password | text" – sofort beim Laden des Formulars wird im Feld ein vorläufiger Text angezeigt, der vom Benutzer geändert oder vollständig gelöscht werden kann;
  • für type="file" (Datei-Upload) gilt nicht, da es sich nicht auf dieses Element auswirkt.

Beispielverwendung für jede der oben genannten Optionen:

CMS auswählen: W.P. Joomla

CMS auswählen: W.P. Joomla

Hier Wertattributwert definiert die folgenden Komponenten jedes Elements: zeigt ein Textfragment für das Feld type="text" ("Ihr Name") an, identifiziert alle mit type="radio" festgelegten Optionsfelder ("1" und "2"), und aktiviert auch die Beschriftung des Buttons („Senden“).

Ein Beispiel für die Erstellung eines schönen HTML-Formulars

Als nächstes werde ich versuchen, Ihnen ein Beispiel-Webformular vorzustellen, dessen Code nicht nur Kombinationen von Eingabetypen mit unterschiedlichen Werten enthält, die Standardtextfelder und -schaltflächen bilden, sondern beispielsweise auch die Einleitung der Fokussierung ermöglichen ein Element nicht nur durch einen direkten Mausklick, sondern auch durch Klicken auf Text.

Bitte beachten Sie, dass zur Erzielung eines einzigartigen Designs einzelne Formularkomponenten eingefügt werden, jeweils mit folgenden Sätzen:

Zurück (maximale Breite: 350 Pixel; Rand: 50 Pixel, automatisch 0; Abstand: 20 Pixel; Hintergrund: #f3ebe1; Schriftfamilie: „Oswald“, serifenlos;) .form-1, .form-2, .form-3 , .form-4 (padding:15px; border:4px double #909090) .form-1, .form-2, .form-3 (border-bottom:none) .form-1 input (display:block; margin- unten:10px; Breite:100%).in (padding-left:40px) .in input (width:100%) ..png) no-repeat;background-position:10px 10px) ..png) no-repeat; Hintergrundposition: 10 Pixel 10 Pixel) .form-4-Eingabe (Anzeige: Block; Höhe: 50 Pixel; Schriftgröße: 24 Pixel; Breite: 100 %; Cursor: Zeiger)

Infolgedessen nimmt ein solches Webformular den folgenden Grundriss an:

Ausführlichere Informationen zum Erstellen dieses speziellen Formulars finden Sie unter diese Seite(Übrigens können Sie dort nicht nur die Funktionalität einzelner Textbereiche durch Eingabe von Daten testen, sondern auch mit dem Webformular experimentieren, indem Sie den HTML-Code und/oder die CSS-Eigenschaften bearbeiten und so dessen Erscheinungsbild ganz oder teilweise ändern.)

Mein Ziel war es, Ihnen den Algorithmus zur Verwendung unterschiedlicher Werte des Typattributs und des Formular-Tags zum Erstellen verschiedener HTML-Formulare auf der Website vorzustellen. Ich hoffe, dass die Aufgabe erledigt ist. Teilen Sie auf jeden Fall Ihre Gedanken zu diesem vielfältigen Thema in den Kommentaren.

Natürlich werde ich in nachfolgenden Veröffentlichungen weiterhin die wichtigsten Tags des Hypertext-Markups beschreiben. Vergessen Sie also nicht, Blog-Updates per E-Mail zu abonnieren. Um dies zu untermauern, schauen Sie sich auch eine weitere Lektion von Evgeniy Popov zum Erstellen eines Kontaktformulars an.

Beschreibung

HTML-Tag

erstellt ein HTML-Formular, das zum Senden von Benutzereingaben an den Server verwendet wird.

Da das Formular selbst innerhalb des Elements keine Möglichkeit zur Benutzereingabe bietet enthalten weitere Elemente, deren Zweck es ist, dem Benutzer verschiedene Möglichkeiten zur Dateneingabe zu bieten:

Zusätzlich zu diesen Elementen können Sie beliebige andere HTML-Elemente innerhalb des Formulars verwenden.

Standardmäßig wird das Formular in keiner Weise auf der Webseite angezeigt, nur die darin enthaltenen Elemente sind sichtbar, aber mit CSS können Sie dem Formular ein beliebiges Aussehen verleihen.

Attribute

Accept-Charset: Gibt eine Zeichenkodierung oder eine durch Leerzeichen getrennte Liste von Zeichensätzen für Formulareingaben an, die zur Verarbeitung an den Server gesendet werden. Wenn die Daten Zeichen enthalten, die von der angegebenen Kodierung nicht unterstützt werden, versucht der Browser, die geeignete Kodierung für sie zu ermitteln. Wenn keine geeignete Kodierung ermittelt werden kann, werden die Zeichen in numerische Codes kodiert.

Der Standardwert ist die reservierte Zeichenfolge „UNKNOWN“ (Browser interpretieren diesen Wert als eine Zeichenkodierung, die mit der des Dokuments identisch ist, das das Element enthält ). Aktion: Gibt die Adresse zum Senden von Daten aus dem ausgefüllten Formular an, an die diese Informationen verarbeitet werden. Autovervollständigung: Legt fest, ob die automatische Formularvervollständigung aktiviert oder deaktiviert werden soll. Wenn das automatische Ausfüllen aktiviert ist, trägt der Browser automatisch die Werte ein, die der Benutzer bei der vorherigen Verwendung des Formulars eingegeben hat. Mögliche Attributwerte:

  • An: Der Browser zeigt automatisch die zuvor vom Benutzer eingegebenen Werte an (Standardwert).
  • aus: Der Benutzer muss bei jeder Verwendung des Formulars die Werte für jedes Feld eingeben. Zuvor eingegebene Werte werden nicht angezeigt.

Hinweis: Das Autocomplete-Attribut wird vom Opera-Browser nicht unterstützt.

Enctype: Gibt an, wie die Formulardaten codiert werden, wenn sie an den Server übermittelt werden. Kann nur in Verbindung mit dem Attribut method="post" verwendet werden. Mögliche Werte:

  • application/x-www-form-urlencoded: Standard: Alle Zeichen werden vor dem Senden codiert (Leerzeichen werden in „+“-Zeichen und Sonderzeichen in ASCII-HEX-Werte umgewandelt).
  • Multipart/Formulardaten: Zeichen werden nicht kodiert. Wird für Elemente verwendet , dessen Typattribut auf „Datei“ gesetzt ist.
  • Text/einfach: Leerzeichen werden in das „+“-Zeichen umgewandelt, Sonderzeichen wie Apostrophe werden jedoch nicht in Hexadezimalwerte kodiert.
Methode: Gibt die HTTP-Datenübertragungsmethode an, die beim Senden von Formulardaten verwendet wird. Mögliche Werte:
  • erhalten: Die Daten werden als Name=Wert-Paare an die Adressleiste des Browsers übergeben, indem sie an das Ende der URL angehängt werden. Als Trennzeichen zwischen der Haupt-URL und den übertragenen Daten wird ein Fragezeichen (?) und zur Trennung der übertragenen Daten voneinander ein kaufmännisches Und-Zeichen (&) verwendet. Diese Methode wird beim Senden kleiner Datenmengen verwendet.
  • Post: Die Daten werden nicht als Teil der URL gesendet, sondern als Inhalt der Browseranfrage. Mit dieser Methode werden große Datenmengen versendet.
Wenn das Methodenattribut nicht angegeben ist, wird standardmäßig die GET-Methode verwendet. name: Gibt den Namen des Formulars an. Der Name kann in JavaScript verwendet werden, um namentlich auf ein Element zu verweisen oder um auf Formulardaten zu verweisen, nachdem diese übermittelt wurden. Wenn in einem Dokument mehrere Formulare verwendet werden, sollten deren Namen nicht wiederholt werden und als Attributwert kein Leerstring belassen werden. novalidate: Gibt an, dass die in das Formular eingegebenen Daten vor der Übermittlung nicht validiert werden. Mögliche Werte für das boolesche Attribut novalidate:

Hinweis: Das novalidate-Attribut wird in IE9 und früheren Versionen sowie Safari nicht unterstützt.

Ziel: Definiert einen Frame-Namen oder ein Schlüsselwort, das angibt, wo die nach dem Absenden des Formulars empfangene Antwort angezeigt werden soll.

  • _leer:öffnet das Dokument in einem neuen Fenster oder Tab.
  • _selbst:öffnet ein Dokument im selben Verzeichnis, in dem sich der Link befindet (Standard).
  • _Elternteil:öffnet das Dokument im übergeordneten Frame.
  • _Spitze:öffnet das Dokument in voller Fensterbreite.
  • Frame_Name:öffnet ein Dokument in einem Iframe, dessen Name als Wert angegeben wurde.

Etikett unterstützt auch globale Attribute und Ereignisse

Standardstil

form ( display: block; margin-top: 0em; )

Beispiel

Name:
Nachname:

Beim Navigieren durch Websites klickt der Nutzer meist nur darauf Links zum Navigieren auf Webseiten.

Es ist jedoch klar, dass der Benutzer manchmal seine eigenen bereitstellen muss Eingabefelder. Zu diesen Arten von Interaktionen gehören:

  • Registrierung und Login auf Websites;
  • Eingabe persönlicher Daten (Name, Adresse, Kreditkarteninformationen usw.);
  • Inhaltsfilterung (mithilfe von Dropdown-Listen, Kontrollkästchen usw.);
  • Durchführen einer Suche;
  • Herunterladen von Dateien.

Um diesen Anforderungen gerecht zu werden, bietet HTML interaktive Funktionen Kontrollen Formen:

  • Textfelder (für eine oder mehrere Zeilen);
  • Schalter;
  • Kontrollkästchen;
  • Dropdown-Listen;
  • Widgets zum Herunterladen;
  • Senden-Schaltflächen.

Diese Kontrollen beinhalten unterschiedliche Stichworte HTML, aber die meisten verwenden das Tag . Da es sich um ein selbstschließendes Element handelt, wird der Typ des Feldes durch sein Typattribut bestimmt:

Element

ist ein Blockelement, das definiert interaktiv Teil einer Webseite. Dadurch sind sämtliche Kontrollen (wie z.B ,






Tags, Attribute und Werte

  • action="http://site/comments.php" – definiert die URL, an die Daten aus dem Formular gesendet werden.
  • id="" – definiert den Namen und die Kennung des Formularelements.
  • name="" – definiert den Namen des Formularelements.
  • - Definieren Sie ein Textfeld als Teil des Formulars.
  • cols="" – bestimmt die Anzahl der Spalten des Formulartextfelds.
  • rows="" – definiert die Anzahl der Zeilen des Formulartextfelds.

Wenn dazwischen Wenn Sie Text platzieren, wird er als Beispiel im Feld angezeigt und kann leicht entfernt werden.

Beispiel-HTML-Formular | Dropdown-Liste

HTML-Formulare




Tags, Attribute und Werte

  • - Definieren Sie eine Liste mit auszuwählenden Positionen.
  • size="" - bestimmt die Anzahl der sichtbaren Listenpositionen. Wenn der Wert 1 ist, handelt es sich um eine Dropdown-Liste.
  • - Bestimmen Sie die Positionen (Elemente) der Liste.
  • value="" – enthält den Wert, der vom Formular zur Verarbeitung an die angegebene URL gesendet wird.
  • selected="selected" – hebt ein Listenelement als Beispiel hervor.

Beispiel-HTML-Formular | Liste mit Bildlaufleiste

Indem wir den Wert des Attributs size="" erhöhen, erhalten wir eine Liste mit einer Bildlaufleiste:

Erste Position Zweite Position Dritte Position Vierte Position

HTML-Formulare




Verwenden Sie für diese Option das Flag multiple="multiple", das die Auswahl mehrerer Positionen ermöglicht. Da es nicht vorhanden ist, können Sie nur ein Element auswählen.

  • type="submit" – definiert eine Schaltfläche.
  • type="reset" – definiert eine Reset-Schaltfläche.
  • value="" – definiert die Beschriftung der Schaltfläche.
  • Siehe zusätzlich:

    HTML-Formular ist ein Tool, mit dem ein HTML-Dokument bestimmte Informationen an einen vorgegebenen Punkt in der Außenwelt senden kann, wo die Informationen auf irgendeine Weise verarbeitet werden.

    Es ist ziemlich schwierig, in einem HTML-Tutorial über Formulare zu sprechen. Der Grund ist ganz einfach: Das Erstellen eines HTML-Formulars ist viel einfacher als das Erstellen des „Punkts in der Außenwelt“, an den das HTML-Formular Informationen sendet. In den meisten Fällen handelt es sich bei einem solchen „Punkt“ um ein in Perl oder C geschriebenes Programm.

    Programme, die von Formularen übermittelte Daten verarbeiten, werden oft als CGI-Skripte bezeichnet. Das Akronym CGI steht für Common Gateways Interface. Das Schreiben von CGI-Skripten erfordert in den meisten Fällen gute Kenntnisse der entsprechenden Programmiersprache und der Fähigkeiten des Unix-Betriebssystems.

    Derzeit hat sich die PHP/FI-Sprache einigermaßen verbreitet, deren Anweisungen direkt in HTML-Dokumente eingebettet werden können (die Dokumente werden als Dateien mit der Erweiterung *.pht oder *.php gespeichert).

    HTML-Formulare übergeben Informationen in Form von [Variablenname]=[Variablenwert]-Paaren an Handlerprogramme. Variablennamen sollten in lateinischen Buchstaben angegeben werden. Variablenwerte werden von Handlern als Strings behandelt, auch wenn sie nur Zahlen enthalten.

    So funktioniert das HTML-Formular

    Das Formular wird mit dem Tag geöffnet

    und endet mit dem Tag
    . Ein HTML-Dokument kann mehrere Formulare enthalten, die Formulare sollten jedoch nicht ineinander liegen. HTML-Text, einschließlich Tags, kann ohne Einschränkungen in Formulare eingefügt werden.

    Etikett

    kann drei Attribute enthalten, von denen eines erforderlich ist. Dies sind die Attribute:

    Erforderliches Attribut. Bestimmt, wo sich der Formularhandler befindet.

    Bestimmt, wie (mit anderen Worten, mit welcher Methode des Hypertext-Übertragungsprotokolls) Daten aus dem Formular an den Handler übertragen werden. Gültige Werte sind METHOD=POST und METHOD=GET . Wenn der Attributwert nicht gesetzt ist, wird standardmäßig METHOD=GET angenommen.

    Bestimmt, wie Daten aus dem HTML-Formular codiert werden, um an den Handler gesendet zu werden. Wenn der Attributwert nicht festgelegt ist, ist der Standardwert ENCTYPE=application/x-www-form-urlencoded .

    Das einfachste HTML-Formular

    Um den Prozess der Datenübertragung vom Formular zum Handler zu starten, ist eine Art Kontrolle erforderlich. Das Erstellen eines solchen Kontrollorgans ist sehr einfach:

    Wenn Sie im Formular auf eine solche Zeile stoßen, zeichnet der Browser auf dem Bildschirm eine Schaltfläche mit der Aufschrift „Senden“ (lesen Sie „submit“ mit Betonung auf der zweiten Silbe, vom englischen „submit“). Wenn Sie darauf klicken, werden alle verfügbaren Daten angezeigt Das Formular wird an den im Tag definierten Handler übergeben .

    Die Beschriftung der Schaltfläche kann durch Eingabe des Attributs VALUE="[Label] beliebig festgelegt werden." (читается "вэлью" с ударением на первом слоге, от английского "значение"), например:!}

    Jetzt wissen wir genug, um ein einfaches HTML-Formular zu schreiben (Beispiel 11). Es werden keine Daten erfasst, sondern wir werden lediglich zum Text dieses Kapitels zurückgeführt.

    Beispiel 11

    Einfachste Form

    Die auf der Schaltfläche platzierte Beschriftung kann bei Bedarf an den Handler übergeben werden, indem das Attribut NAME=[name] in die Schaltflächendefinition eingeführt wird (lesen Sie „name“, von englisch „name“), zum Beispiel:

    Wenn Sie auf einen solchen Button klicken, erhält der Handler zusammen mit allen anderen Daten eine Button-Variable mit dem Wert Let's go! .

    Ein Formular kann mehrere Absenden-Schaltflächen mit unterschiedlichen Namen und/oder Werten haben. Der Handler kann somit unterschiedlich agieren, je nachdem, auf welche Submit-Schaltfläche der Benutzer geklickt hat.

    Wie ein HTML-Formular Daten sammelt

    Es gibt andere Arten von Elementen . Jedes Element muss das Attribut NAME=[name] enthalten, das den Namen des Elements angibt (und dementsprechend den Namen der Variablen, die an den Handler übergeben wird). Der Name muss angegeben werden nur in lateinischen Buchstaben. Die meisten Artikel muss das Attribut VALUE="[Wert] enthalten" , определяющий значение, которое будет передано обработчику под этим именем. Для элементов !} Und Dieses Attribut ist jedoch optional, da der Wert der entsprechenden Variablen vom Benutzer über die Tastatur eingegeben werden kann.

    Grundlegende Elementtypen :

    TYPE=Text

    Definiert ein Fenster zur Eingabe einer Textzeile. Kann zusätzliche Attribute SIZE=[Anzahl] (Breite des Eingabefensters in Zeichen) und MAXLENGTH=[Anzahl] (maximal zulässige Länge der Eingabezeichenfolge in Zeichen) enthalten.

    Beispiel:

    Definiert ein 20 Zeichen breites Fenster für die Texteingabe. Standardmäßig enthält das Fenster den Text Ivan, den der Benutzer bearbeiten kann. Der bearbeitete (oder unbearbeitete) Text wird in der Benutzervariablen an den Handler übergeben.

    TYPE=Passwort

    Definiert ein Fenster zur Eingabe eines Passwortes. Absolut ähnlich dem Texttyp, nur dass anstelle von Symbolen des eingegebenen Textes Sternchen (*) auf dem Bildschirm angezeigt werden. Beispiel:

    Definiert ein 20 Zeichen breites Fenster zur Eingabe eines Passworts. Die maximal zulässige Passwortlänge beträgt 10 Zeichen. Das eingegebene Passwort wird in der Variablen pw an den Handler übergeben.

    TYP=Radio

    Definiert ein Optionsfeld. Kann ein zusätzliches geprüftes Attribut enthalten (zeigt an, dass die Schaltfläche aktiviert ist). In einer Gruppe von Optionsfeldern mit demselben Namen kann es nur ein beschriftetes Optionsfeld geben.

    Beispiel:

    9600 bps
    14400 Bit/s
    28800 bps

    Definiert eine Gruppe von drei Optionsfeldern mit den Bezeichnungen 9600 bps, 14400 bps und 28800 bps. Die erste der Schaltflächen ist zunächst beschriftet. Wenn der Benutzer keine andere Schaltfläche aktiviert, wird die Modemvariable mit dem Wert 9600 an den Handler übergeben. Wenn der Benutzer eine andere Schaltfläche aktiviert, wird eine Modemvariable mit einem Wert von 14400 oder 28800 an den Handler übergeben.

    TYPE=Kontrollkästchen

    Definiert ein Quadrat, in dem eine Markierung vorgenommen werden kann. Kann ein zusätzliches geprüftes Attribut enthalten (zeigt an, dass das Quadrat geprüft ist). Im Gegensatz zu Optionsfeldern kann eine Gruppe von Quadraten mit demselben Namen mehrere beschriftete Quadrate haben.

    Beispiel:

    Persönliche Computer
    Arbeitsplätze
    Lokale Netzwerkserver
    Internetserver

    Definiert eine Gruppe von vier Quadraten. Das zweite und vierte Quadrat werden zunächst markiert. Wenn der Benutzer keine Änderungen vornimmt, werden zwei Variablen an den Handler übergeben: comp=WS und comp=IS .

    TYP=versteckt

    Definiert ein verstecktes Datenelement, das für den Benutzer beim Ausfüllen des Formulars nicht sichtbar ist und unverändert an den Handler übergeben wird. Manchmal ist es nützlich, ein solches Element in einem Formular zu haben, das von Zeit zu Zeit neu gestaltet wird, damit der Handler weiß, um welche Version des Formulars es sich handelt. Weitere Einsatzmöglichkeiten können Sie sich ganz einfach selbst ausdenken.

    Beispiel:

    Definiert eine versteckte Versionsvariable, die mit dem Wert 1,1 an den Handler übergeben wird.

    TYP=Zurücksetzen

    Definiert eine Schaltfläche, die beim Klicken das HTML-Formular in seinen ursprünglichen Zustand zurückversetzt. Da bei Verwendung dieser Schaltfläche keine Daten an den Handler übergeben werden, verfügt eine Reset-Schaltfläche möglicherweise nicht über ein Namensattribut.

    Beispiel:

    Definiert eine Schaltfläche zum Löschen von Formularfeldern, die beim Klicken das HTML-Formular in seinen ursprünglichen Zustand zurückversetzt.

    Außer den Elementen , HTML-Formulare können Menüs enthalten

    Alle Attribute sind erforderlich. Das NAME-Attribut definiert den Namen, unter dem der Inhalt des Fensters an den Handler übertragen wird (im Beispiel Adresse). Das ROWS-Attribut legt die Höhe des Fensters in Zeilen fest (5 im Beispiel). Das COLS-Attribut legt die Breite des Fensters in Zeichen fest (im Beispiel 50).

    Text zwischen Tags platziert , stellt den Standardinhalt des Fensters dar. Der Benutzer kann es bearbeiten oder einfach löschen.

    Es ist wichtig zu wissen, dass sich im Fenster russische Buchstaben befinden