So fügen Sie Schaltflächen zu einem HTML5-Formular

Die allgegenwärtige Schaltfläche ist eine Klammer einer beliebigen Webseite, und wenn Sie Ihre Seite Gebäude sind mit HTML5, können Sie alle gängigen Arten von Tasten umfassen. Es gibt drei Haupttypen von Tasten, obwohl sie alle dem Benutzer identisch aussehen:

  • Standard-Schaltfläche: Ein Standard-Schaltfläche sieht aus wie eine Taste. Diese Tasten sind ziemlich viel in der javascript-Programmierung verwendet eine Art von Aktion auf dem Client-Ende auslösen.

  • Submit-Button: Diese Taste wird normalerweise in serverseitige Programmierung verwendet. Es enthält sowohl auf alle Daten in der Form und legt sie auf ein Programm, das auf einem Remote-Webserver lebt.

  • Reset-Knopf: Diese spezielle Tastentyp hat eine eingebaute im Verhalten. Wenn der Benutzer eine Reset-Taste klickt, werden alle Daten in der Form auf die ursprünglichen Standardwerte zurückgesetzt.

Die Form, in der Figur zeigt jede Art von Taste suchen, die alle so ziemlich das gleiche:

bild0.jpg

Zusätzlich zu den drei Arten von Tasten, Tastenelemente können auf zwei verschiedene Arten erzeugt werden. Der erste ist mit der Eingang Element- benutzen Sie einfach den folgenden Code:

Wenn in dieser Weise verwendet, die Wert Eigenschaft wird die Beschriftung der Schaltfläche, und die Art Eigenschaft gibt an, welche Art von Taste, die Sie bauen möchten. Es ist nicht notwendig, ein Etikett auf eine Schaltfläche hinzuzufügen, weil das Etikett impliziert.

Aber weil die Knöpfe nicht wirklich für die Eingabe verwendet, aber festlegen, dass der Benutzer etwas tun will, eine neue Schaltfläche Syntax hat sich weiterentwickelt:

Diese Syntax stellt ein Taste Tag mit Start- und End-Tags. Das Art Attribut wird verwendet, um Sie, um anzuzeigen, welche Art von Taste verwenden möchten. (Der Standardtyp ist "einreichen", aber es ist in erster Linie in die serverseitige Entwicklung verwendet.)

Das Taste Syntax neigt sauberer zu sein, und es macht die CSS-Formatierung etwas einfacher, als Tasten selten in der gleichen Weise wie andere Eingabeelemente formatiert sind.

Der Code für eine Web-Seite mit beiden Arten von Button sieht wie folgt aus:

formDemo.html

Formular Demo

Menü