Was ist eine Form?
Formen in HTML sind ein wichtiges Mittel für HTML -Seiten, um mit dem Browser zu interagieren. Mit dem Formular kann der Server relevante Informationen sammeln, die vom Client -Browser übermittelt wurden, z. B. das eingegebene Kennwort usw. Beim Durchsuchen von Websites stoßen wir häufig auf Formulare. Sie sind ein wichtiger Teil der interaktiven Funktion zwischen dem Server und dem Browser. Interaktion bedeutet hier einen Prozess des Austauschs von Daten miteinander, z. B. das Übertragen des Kennworts, das wir lokal an den Server eingegeben haben. Unabhängig davon, in welcher Sprachform die Website die interaktiven Funktionen der Website implementiert, wie ASP, PHP, JSP usw., sind Formulare jetzt zu ihrer einheitlichen Informationssammlungsmethode geworden.
Die Hauptfunktion eines Formulars besteht darin, Informationen, insbesondere die Informationen des Betrachters, zu sammeln. Wenn Sie beispielsweise online eine E -Mail beantragen, müssen Sie die von der Website nach Bedarf bereitgestellte Formularseite ausfüllen, die hauptsächlich persönliche Informationen wie Name, Alter, Kontaktinformationen usw. enthält. Wenn Sie beispielsweise in einem Forum sprechen möchten, müssen Sie sich vor dem Sprechen eine Qualifikation bewerben, und Sie müssen eine Formularseite ausfüllen. Natürlich ist das Formular unsichtbar, ohne den Quellcode zu betrachten, und Benutzer können nicht das Gefühl haben, dass das Formular existiert.
Formulare können normalerweise für Umfrage, Bestellung, Suche und andere Funktionen verwendet werden. Im Allgemeinen bestehen Formen aus zwei Teilen. Eines ist der HTML -Quellcode, der die Formularelemente beschreibt. Im Browser finden wir diesen Teil über den Quellcode. Das zweite ist das Client-Skript oder das vom Server verwendete Programm, um das Einfüllen des Benutzers zu verarbeiten. Hier verarbeitet es hauptsächlich die gesammelten Daten. Zum Beispiel muss das im obige Beispiel erhaltene Kennwort an den Server übertragen werden, um zu überprüfen, ob das Kennwort korrekt ist. Wenn es korrekt ist, wird es eingegeben, und wenn es fehlerfrei ist, wird es nicht angemeldet. Dies ist ein Verarbeitungsprozess. In HTML können wir Formulare definieren und mit Formhandlern in serverseitigen Skriptsprachen wie ASP und PHP zusammenarbeiten. Der Prozess der Verarbeitungsformularinformationen lautet: Wenn wir auf die im Formular eingereichte Schaltfläche klicken, werden die im Formular eingegebenen Informationen an den Server übertragen und dann von den relevanten Anwendungen des Servers verarbeitet. Speichern Sie nach der Verarbeitung entweder die vom Benutzer in der Serverdatenbank übermittelten Informationen oder geben Sie die relevanten Informationen an den Browser des Kunden zurück. Schauen wir uns die verschiedenen Wissenspunkte der Form genauer an.
1. Form Tag <Form>
Ein Formular befindet sich in einem bestimmten Bereich auf einer Webseite, das durch ein Paar <form> -Tags definiert und identifiziert wird. <form> Tags haben zwei Hauptfunktionen auf Webseiten.
Zunächst können Sie den Umfang seiner Funktion der Form definieren, und andere Form -Objektmarkierungen müssen in die Form eingefügt werden. Wenn wir beispielsweise auf die Schaltfläche Senden klicken, senden wir Inhalte im Bereich des Formulars und Inhalte außerhalb des Formulars werden nicht eingereicht.
Zweitens enthält es die relevanten Informationen des Formulars selbst, z. B. den Ort des Skriptprogramms, das das Formular verarbeitet, die Methode zum Senden des Formulars usw. Die grundlegende Syntax und die Syntax des Formulars werden wie folgt erläutert.
Grundlegende Syntax:
<Formular name = form_name methode = methode action = url engType = value target = target_win> ............ </form>
Die Erklärung der Syntax lautet wie folgt:
Eigentum | beschreiben |
NAME | Der Name der Form |
VERFAHREN | Definieren Sie die Methode zum Übertragen des Formulars aus dem Browser auf den Server unter Verwendung von zwei Methoden: Get and Post |
AKTION | Definieren Sie den Ort des Formularhandlers, es gibt zwei Arten: absoluter Pfad und relativer Pfad. |
Enctype | Stellen Sie die Codierungsmethode des Formulars fest |
ZIEL | Legen Sie die Anzeigemethode der Rückgabeinformationen fest |
Unter den oben genannten Attributen sind Name, Methode und Aktion am häufigsten verwendet und sind auch die Grundlage für die Analyse des Skriptprogramms. Sie werden unten ausführlich erklärt und erläutert. 1. Die grundlegende Syntax des Namensattributs des <form> -Tags lautet: <Formularname = Form_Name> ……………………… <Formular> Durch den Formularnamen können Sie die Beziehung zwischen dem Formular und dem Serverhandler steuern und den Namen verwenden, um die Kennung der Programmverarbeitung im Server zu bestimmen.
2. Die grundlegende Syntax des Aktionsattributs des <form> -Tags lautet: <Form Aktion = url> …………………… <Formular> Durch das Aktionsattribut des Formulars wird die Adresse der Dateneingabe im Formular definiert. Diese Adresse kann ein absoluter Pfad, ein relativer Pfad oder eine E -Mail -Adresse sein.
Zum Beispiel: <Formular name = mailAction = mailto: [email protected]>
3.. Die grundlegende Syntax des mTHOD -Attributs des <form> -Tags lautet: <Form MTHOD = Methode> ……………… <form> Es gibt zwei Methoden zur Auswahl aus MTHOD, einer ist erhalten und der andere ist ein Post. Beim Senden von Daten über die GET -Methode werden alle Inhalte im Formular nach der URL -Adresse angehängt, die durch ein Fragezeichen getrennt ist. Das Format des Datenübergangs ist Name = Wert. Name ist der Name der zu übergebenen Daten, und der Wert ist der Wert, der übergeben wird. Wenn mehrere Werte übergeben werden müssen, können die mehreren Werte durch Symbole & getrennt werden. Zum Beispiel http: //localhost/haha/haha.asp? Name1 = value1 & name2 = value2. Da diese Daten hinter der URL -Adresse liegen, ist die Länge der eingereichten Informationen begrenzt und darf 8192 Zeichen nicht überschreiten. Die am häufigsten verwendete Methode ist die Post -Methode. Diese Methode enthält die vom Benutzer ausgefüllten Daten in der Form des Formulars und übergibt sie zusammen an den Serverhandler. Daher gibt es für diese Methode keine Größengrenze. Wenn es nicht angibt, welche Methode die Standardmethode ist, ist die GET -Methode. Nachdem Sie das Formular -Tag <Form> definiert haben, können Sie die Tags für den Code hinzufügen, der die spezifische Funktion ausführt. Es gibt 4 Tags, die in das Formular enthalten sein können, wie in der folgenden Tabelle gezeigt
markieren | beschreiben |
<eingabe> | Formulareingangs -Tags |
<Selech> | Menü- und Listen -Tags |
<OPTION> | Menü- und Listenelement -Tags |
<textarea> | Textdomänenmarkierungen |
Im HTML -Code ist ihre Organisation wie folgt
<form> <eingabe> ...
Für die obigen Tags sollten die beiden häufigsten Skript -Hacking -Technologien <Peds> und <textarea> sein. Erklären wir diese beiden Tags im Folgenden im Detail. 2. Eingabe -Tag <Eingabe -Tag> Eingabe -Tag <eingabe> ist eines der am häufigsten verwendeten Tags in Formularen. Die Textfelder und Schaltflächen, die wir häufig auf Webseiten verwenden, werden alle verwendet. Die grundlegende Syntax ist wie folgt:
<form> <Eingabename = field_name type = type_name> </form>
Wo Name der Name der Domäne und der Typ ist der Typ der Domäne. In der Typ -Eigenschaft können viele Eigenschaftswerte auftreten. Unter diesen sind die häufig verwendeten und eng verwandten Hacking -Technologien: Text, Passwort, Datei, Schaltfläche, Senden, Zurücksetzen, Versteckt. 1. Textdomänentext
Der Text -Attributwert wird verwendet, um den Textbereich des Formulars festzulegen und eine beliebige Art von Text, Zahlen und Buchstaben einzugeben. Die Eingabedaten werden in einer einzelnen Zeile angezeigt. Es kann für alle schwierig sein, dies zu verstehen. Ich werde Ihnen ein Beispiel geben, um es später zu veranschaulichen. Schauen Sie sich zunächst seine grundlegende Grammatik und grammatikalische Erklärung an. Grundlegende Syntax: <Eingabe type = Textname = field_name maxLength = value size = value value = field_value> syntax interpretation: Diese Erklärungen sind in der folgenden Tabelle angezeigt
Textdomänenattribute | beschreiben |
NAME | Name des Textfelds |
Maxlenlänge | Maximale Anzahl der Eingabezeichen im Textfeld |
GRÖSSE | Breite des Textfelds (in Zeichen) |
WERT | Standardwert für das Textfeld |
Dies ist ein wesentliches Wissen über die Textdomäne. Viele Freunde können es immer noch nicht verstehen. Schreiben wir ein Beispiel, um den folgenden Code zu veranschaulichen:
<html> <Head> <titels> Textdomäne einfügen </title> </head> <body> Benutzerumfrage <Formular Action = Mailto: [email protected] Methode = Get name = haha> <!-Schreiben eines Formulars zum Verbinden als E-Mail-Adresse. Website: <Eingabetyp = Textname = url size = 20 maxLength = 50 value = http: /// <!-Schreiben einer Textdomäne mit der Namens-URL, die Breite 20 und die maximale Eingangslänge 50 beträgt. Der Standardwert ist http: //-> </from> </body> </html>
Nach dem Schreiben des Code ändern wir den Suffixnamen in HTML und führen ihn aus. Wie in (Abbildung 1). Für solche Bilder glaube ich, dass alle Freunde, die im Internet surfen können, sie sehen sollen.
(Abbildung 1)
2. Passwort Domain PasswortWenn wir online sind, müssen wir beispielsweise ein Passwort eingeben, wenn wir uns bei der E -Mail -Adresse anmelden. Das Eingabefeld für die Eingabe des Kennworts wird als Kennwortdomäne bezeichnet, eine andere Form der Textdomäne. Seine Funktion ist, dass alle in das Textfeld eingegebenen Artikel mit Sternchen* oder Punkten angezeigt werden. Die grundlegende Syntax ähnelt dem obigen Textfeld. Der Unterschied besteht darin, dass Sie nur den Text im Typ auf Passwort ändern müssen. Fügen Sie basierend auf dem Beispiel des oben genannten Textfelds ein Codekennwort zwischen den <Formular> -Tags hinzu: <inpyt type = passwordname = kennwort size = 20 maxLength = 30> Nach dem Speichern öffnen Sie die Datei und geben Sie jedes Zeichen in das Kennworteingangsfeld ein, um zu sehen, dass es sich um einen Punkt handelt, aber das reale Zeichen wird wie in Abbildung 2 gezeigt versteckt (Abbildung 2).
(Abbildung 2)
3. Dateidomänendatei
Mit der Dateidomäne können wir die Dateien auf unserem lokalen Computer in der Domäne ausfüllen und schließlich über das Formular hochladen. Dies ist die Grundfunktion der Dateidomäne. Die am häufigsten verwendete sollte hochladen. In Bezug auf das Erscheinungsbild ist das Dateifeld ein Textfeld und eine Browserschaltfläche. Wir können entweder den Pfad der Datei direkt ausfüllen, die im Textfeld auf die Website hochgeladen werden soll, oder klicken Sie auf die Schaltfläche Browser, um die Datei zu finden, die auf unserem Computer hochgeladen werden soll.
Die grundlegende Syntax ist
<Eingabe type = Dateiname = field_name> Sein Typ ist Datei, Name ist der Name dieses Dateifeldes. Schreiben wir einfach ein Dateifeld, der Code lautet wie folgt:
<html> <kopf> <titels> Textfeld </title> </head> <body> <form> Bitte laden Sie Ihr Foto hoch: <Eingabe type = Dateiname = Datei> </Form> </body> </html>
Öffnen Sie nach dem Speichern es und Sie können das wahre Gesicht des Textfelds sehen, wie in (Abbildung 3). Ich glaube, jeder hat solche hochgeladenen Bilder gesehen.
(Abbildung 3)
4. Tasten in der Taste -Form spielen eine entscheidende Rolle. Die Schaltfläche kann die Funktion haben, alle Daten des Formulars an den Server zu senden und das Formular in seinen Ausgangszustand wiederherzustellen, wenn der Benutzer das Formular ändern muss, und kann auch andere Rollen entsprechend den Anforderungen des Programms spielen. Die Schaltflächen sind im Allgemeinen in drei Typen unterteilt: Schaltfläche (normale Schaltfläche), Senden (Schaltfläche Senden) und zurücksetzen (Schaltfläche zurücksetzen). Die Syntax der Taste Normale Taste ist <Eingabetyp = Schaltfläche name = field_name value = button_text>, wobei der Wertwert der auf der Schaltfläche angezeigte Text darstellt. Der Zweck der Übermittlung von Schaltflächen besteht darin, alle Daten im Formular nach dem Klicken auf diese Schaltfläche an den Serverhandler zu senden. Die grundlegende Syntax ist <Eingabetyp = Senden name = field_name value = button_text>, wobei der Wertwert den auf der Schaltfläche angezeigten Text darstellt. Zurücksetzen der Schaltfläche Zurücksetzen bedeutet, dass nach dem Klicken auf die Schaltfläche alle Daten, die wir zum Formular hinzugefügt haben, gelöscht und in die Standardformulareinstellungen wiederhergestellt werden. Die grundlegende Syntax ist <Eingabe type = reset name = field_name value = button_text> erneut: In der HTML -Sprache ist die Größe nicht zu unterscheiden. Schreiben wir kurz ein Beispiel, um die Wirkung der Schaltfläche zu üben. Der Code ist wie folgt.
<html> <Head> <title> Formular -Schaltfläche Demo </title> </head> <body> Benutzerregistrierung <Formular Action = mailto: [email protected] Methode = Get Name = haha> Name: <Eingabe type = textname = userername size = 20> <br> Passwort: <Eingabe -Typ = Passwort = Passwort = 20 MAXLENGE = 20> <BR> -Styp: <MAXLAGE = 20> <BR> <BR> -Styp: <Eingabe -Sicht = 20 mAXLENGEN = 30> <BR> <BR> -Styp: <Eingabe -Typ = 20 mAXLENGE = 30> <BR> <BR> <BR> <BR> -Styps: <mach = 20> <BR> <BR; value = http://> <br> <Eingabetyp = Schaltfläche name = field_name value = Normale Taste> <Eingabe type = surenden name = field_name value = suruging button> <Eingabe typ
Öffnen Sie nach dem Speichern die Datei und werfen Sie einen Blick auf, wie in (Abbildung 4). Ich denke, Sie haben ähnliche Bilder gesehen, und die häufigsten werden bei der Registrierung von Benutzern verwendet.
(Abbildung 4)
5. Domäne versteckt versteckt
Die versteckte Domain ist für US -Benutzer auf der Seite nicht sichtbar, da sie versteckt ist. Der Zweck, die versteckte Domäne in das Formular einzuführen, besteht darin, Informationen zu sammeln oder zu senden. Wenn wir auf die Schaltfläche "Senden" klicken, um Formulardaten zu senden, werden auch die Informationen versteckte Domäneninformationen an den Server gesendet. Seine grundlegende Syntax ist <Eingabe type = field_name value = value>. Der Grund, warum ich Ihnen auch erkläre, ist, dass viele Programme darin bestehen, Programme zu schreiben, die der Meinung sind, dass dies versteckt ist, und der Meinung ist, dass der Benutzer es nicht sehen kann. Daher gibt es in vielen Fällen keine versteckten Domänenparameter zur Erkennung und Filterung, so dass viele Sicherheitsunfälle aufgetreten sind.3. Textfeld Tag <textArea>
Dieses Tag wird normalerweise verwendet, um mehrere Zeilen von Textfeldern in einer Webseite zu erstellen, damit mehr Text eingegeben und die am häufigsten verwendeten Kommentare des Artikels verwendet werden können.
Seine grundlegende Syntax ist:
<TextArea name = name rows = value cols = value value = value> </textArea>
Die Eigenschaften, die es hat, werden in der folgenden Tabelle angezeigt.
Textfeld -Tag -Eigenschaften | beschreiben |
Name | Name des Textfelds |
Reihen | Anzahl der Zeilen in Textfeldern |
cols | Anzahl der Spalten in Textfeldern |
Wert | Standardwert für das Textfeld |
Das Folgende ist ein Beispiel, um es ausführlich zu erklären, damit jeder aus der Praxis verstehen kann, dass dies nicht sehr schwierig ist. Der spezifische Code lautet wie folgt:
<html> <Head> <titels> Textdomänenfunktion Demonstration </title> </head> <body> Benutzerumfrage <Formular Action = Mailto: [email protected] Methode = Get name = haha> Message Board: <br> <textarea name = comment ROWS = 5 cols = 40> </textarea> <br> <Eingabe type = field_name = field_name = surfen name = surfen name = subordname = subordname = surfen name = surfen name = subordname = meldung surfen a meldung reichen> meldung surfen a meldung surfen a meldung reichen> </textarea> <br> <Be Eingabe = field_name = meldung ag. </body> </html>
Speichern Sie den Code und ändern Sie den Suffixnamen und öffnen Sie ihn, um festzustellen, ob er wie in der Message Board im Internet übereinstimmt, wie in (Abbildung 5) gezeigt.
(Abbildung 5)