it-swarm.com.de

Unterschied zwischen <input type = 'button' /> und <input type = 'submit' />

Es gibt keine blöde Frage, also los geht's: Was ist der Unterschied zwischen <input type='button' /> und <input type='submit' />?

213
bounav

Die Schaltflächen <input type="button" /> Senden kein Formular - sie tun standardmäßig nichts. Sie werden im Allgemeinen in Verbindung mit JavaScript als Teil einer AJAX Anwendung verwendet.

Die Schaltflächen <input type="submit"> Senden das Formular, in dem sie sich befinden, wenn der Benutzer darauf klickt, sofern Sie mit JavaScript nichts anderes angeben.

221
user7094

Eine Schaltfläche ist genau das, eine Schaltfläche, der Sie mithilfe von Javascript zusätzliche Funktionen hinzufügen können. Ein Eingabetyp "Senden" hat die Standardfunktionalität, dass er das Formular sendet, in dem er platziert ist (Sie können jedoch auch weiterhin zusätzliche Funktionen mithilfe von Javascript hinzufügen).

17
Aistina

Die Schaltfläche sendet das Formular nicht selbst. Es handelt sich um eine einfache Schaltfläche, mit der einige Vorgänge mit Javascript ausgeführt werden. Die Schaltfläche Senden sendet das Formular standardmäßig, wenn der Benutzer auf die Schaltfläche Senden klickt.

6

Es sollte auch erwähnt werden, dass eine benannte Eingabe des Typs "submit" zusammen mit den benannten Feldern des anderen Formulars gesendet wird, während eine benannte Eingabe des Typs "button" dies nicht tut.

Mit anderen Worten, im folgenden Beispiel wird der benannte Eingang name=button1 WIRD NICHT gesendet, während die benannte Eingabe name=submit1 [~ # ~] wird [~ # ~] übermittelt.

Beispiel-HTML-Formular (index.html):

<form action="checkout.php" method="POST">

  <!-- this won't get submitted despite being named -->
  <input type="button" name="button1" value="a button">

  <!-- this one does; so the input's TYPE is important! -->
  <input type="submit" name="submit1" value="a submit button">

</form>

Das PHP Skript (checkout.php), das die Aktion des obigen Formulars verarbeitet:

<?php var_dump($_POST); ?>

Testen Sie das Obige auf Ihrem lokalen Computer, indem Sie die beiden Dateien in einem Ordner mit dem Namen/tmp/test/erstellen und dann den integrierten PHP= Webserver von Shell aus ausführen:

php -S localhost:3000 -t /tmp/test/

Öffnen Sie Ihren Browser unter http: // localhost: 30 und überzeugen Sie sich.

Man würde sich fragen, warum wir einen benannten Button einreichen müssen? Dies hängt vom Back-End-Skript ab. Zum Beispiel wird das WooCommerce WordPress Plugin keine Checkout-Seite verarbeiten, es sei denn, das Place Order benannte Schaltfläche wird ebenfalls gesendet. Wenn Sie den Typ von Submit bis Button ändern, hat dieser Button gewonnen. ' Es wird nicht gesendet und daher wird das Checkout-Formular niemals verarbeitet.

Dies ist wahrscheinlich ein kleines Detail, aber Sie wissen, der Teufel steckt im Detail.

3

Der IE 8 verwendet tatsächlich die erste Schaltfläche, auf die er trifft. Anstatt einfach anzugeben, was gewünscht wird, indem man es zu einem Eingabetyp macht, ist das Absenden der Bestellung auf der Seite tatsächlich von Bedeutung.

3
Martin Murphy

W3C machen deutlich, auf die Spezifikation über Button-Element

Button kann als allgemeine Klasse für alle Arten von Buttons ohne Standardverhalten angesehen werden.

W3C

0
Mahfoud Boukert

type='Submit' ist so eingestellt, dass die Werte bei BACK-END (PHP, .NET usw.) weitergeleitet und abgerufen werden. type='button' spiegelt das normale Tastenverhalten wider.

0

<input type="button"> kann überall verwendet werden, nicht nur innerhalb eines Formulars, und sie senden kein Formular, wenn sie sich in einem befinden. Viel besser geeignet für Javascript.

<input type="submit"> sollte nur in Formularen verwendet werden und sendet eine Anfrage (entweder GET oder POST) an die angegebene URL. Sie sollten nicht an eine beliebige HTML-Stelle gestellt werden.

0
user6394012