Ausführliche Erläuterung der Eingabe, Schaltfläche „Senden“, und Eingabe der wichtigsten Übermittlungsdaten

<form>
  <input name="name">
  <input type="submit" value="提交">
</form>

Auf diese Weise übermittelt: Wenn der Eingabewert 22222222 ist, wird die später übermittelte URL zu localhost:3980/input.html?name=222222
Es gibt einige bemerkenswerte Details:

Nach dem Festlegen von type=submit wird das Eingabesteuerelement zu einer Schaltfläche und der angezeigte Text ist sein Wert. Der Standardwert ist Submit.
Der Standardwert von form[method] ist GET, daher wird nach der Übermittlung die GET-Methode verwendet, um zur Seite zu springen.
Der Standardwert von input[type] ist Text, sodass die erste Eingabe als Textfeld angezeigt wird.

Eingabe ist eigentlich eine Schaltfläche, die von einem Eingabesteuerelement abgeändert wurde, das aus dem groben Design der frühen Tage des Webs stammt. Wir können dies überprüfen, indem wir einen Namen dafür festlegen:

2f525228795bdf9e610202cf159ae6a2

Submit Die endgültige URL wird zu localhost:3980/input.html?name=222222&btn=submit

Beachten Sie, dass die URL /?key=foo&btn=ok lautet. Das Eingabesteuerelement als Schaltfläche wird auch als Formulareingabe an den Server übermittelt. Handelt es sich um ein interaktives Steuerelement oder ein Datensteuerelement? Die Positionierung ist etwas unklar. Darüber hinaus lässt sich sein Stil nur schwer anpassen und kann nicht als Container für andere Tags verwendet werden. Daher wird empfohlen, die Eingabe nicht als Schaltfläche zum Senden eines Formulars zu verwenden.

Hinweis: Das Typattribut der Eingabe kann auch eine Schaltfläche sein. In diesem Fall handelt es sich nur um eine Schaltfläche, die keine Formularübermittlung auslöst.

2. Schaltfläche[tpe=submit] Die Semantik der Schaltfläche ist sehr klar, das heißt, eine Schaltfläche enthält keine Daten und ihre Funktion ist die Benutzerinteraktion. Es verfügt aber auch über Typ- und Wertattribute. Der Standardwert des Typs ist „Senden“. Wenn Sie also auf eine Schaltfläche klicken, wird das Formular gesendet:

<form>
 <input name=&#39;key&#39;>
 <button>确定</button>
</form>

Wenn Sie die IE-Browserkompatibilität nutzen, denken Sie bitte daran, dass der Standardwert von „button[type]“ im IE ist ist button , was bedeutet, dass es nur eine Schaltfläche ist und keine Formularübermittlung auslöst.

Darüber hinaus legen wir den Text des Buttons fest, indem wir den Elementinhalt festlegen. Dies bedeutet, dass es sich bei der Schaltfläche um ein Container-Steuerelement handelt, das beliebige HTML-Tags enthalten kann, und der Stil einfacher anzupassen ist. Dies ist einer der Gründe, warum Schaltflächen in der Bootstrap-Dokumentation häufig als Beispiele verwendet werden.

Allerdings werden die Tasten unordentlich sein. Mit der Schaltfläche können Name und Wert festgelegt werden. Beim Absenden des Formulars wird der Wert als Formulardaten an den Server übermittelt. Im IE wird der Inhalt zwischen den Start- und End-Tags der Schaltfläche sogar als dem Namen entsprechender Wert an den Server übermittelt. Die Ähnlichkeiten zwischen Schaltfläche und Eingabe enden hier jedoch nicht. Durch Klicken auf die Schaltfläche wird das Formular zurückgesetzt (dies ist sehr nützlich). w3school gibt das folgende Beispiel:

<form action="form_action.asp" method="get">
 First name: <input type="text" name="fname" />
 Last name: <input type="text" name="lname" />
 <button type="submit" value="Submit">Submit</button>
 <button type="reset" value="Reset">Reset</button>
</form>

Über Schaltflächen gibt es nicht viel zu sagen. Es wird empfohlen, Schaltflächen als interaktive Schaltflächen zum Absenden von Formularen zu verwenden. Bitte achten Sie auch auf die Einstellung type=submit, um die Kompatibilität mit dem IE zu gewährleisten.

Eingabetaste zum Absenden des Formulars

Eingabetaste zum Absenden des Formulars! Möglicherweise haben Sie jedoch bemerkt, dass nicht alle Formulare mit der Eingabetaste übermittelt werden können. Schauen wir uns den HTML2.0-Standard an:

Wenn ein Formular nur ein einzeiliges Texteingabefeld enthält, sollte der Benutzeragent die Eingabe in dieses Feld als Aufforderung zum Senden des Formulars akzeptieren.

Wenn das Formular nur ein einzeiliges Texteingabesteuerelement enthält, sollte der Benutzeragent die Eingabetaste akzeptieren, um das Formular abzusenden.

„Einzeilig“ bezieht sich auf den Typ „Text“ und nicht auf „Textbereich“. Offensichtlich ist es nicht akzeptabel, die Eingabetaste zu drücken, um das Formular im Textbereich zu senden. Tatsächlich können in der Praxis auch mehrere einzeilige Eingaben mit der Eingabetaste übermittelt werden, beispielsweise auf der Anmeldeseite.

4. Formularübermittlung verhindern

Das Verhindern der Formularübermittlung ist ebenfalls ein häufiges Thema und wird normalerweise für die clientseitige Formularvalidierung verwendet. Die allgemeine Methode besteht darin, onsubmit festzulegen:

<form onsubmit="return false;">
 <input name=&#39;key&#39;>
 <input value=&#39;ok&#39; type=&#39;submit&#39;>
</form>

Sie müssen nur am Ende einer Reihe von onsubmit-Anweisungen false zurückgeben, um zu verhindern, dass sie übermittelt wird. Wenn Sie eine Methode aufrufen möchten, um zu entscheiden, ob die Übermittlung verhindert werden soll, denken Sie daran, den Rückgabewert der Methode hier zurückzugeben:

<form onsubmit="return false;">
 <input name=&#39;key&#39;>
 <input value=&#39;ok&#39; type=&#39;submit&#39;>
</form>

Weitere Informationen zum Senden, zur Eingabetaste und zur Eingabe wichtiger Übermittlungsdaten erhalten Sie bitte Achten Sie auf PHP-Chinesisch!