<input type = 'button' />と<input type = 'submit' />の違い

愚かな質問のようなものはそうここに私達は行く、ありません。違いは何である<input type='button' />とは<input type='submit' />？

<input type="button" />ボタンはフォームを送信しません-デフォルトでは何もしません。これらは通常、AJAXアプリケーションの一部としてJavaScriptと組み合わせて使用​​されます。

<input type="submit"> JavaScriptで特に指定しない限り、ユーザーがボタンをクリックしたときに、ボタンはフォームを送信します。

「ボタン」とは、Javascriptを使用して機能を追加できるボタンのことです。「送信」入力タイプには、配置されたフォームを送信するデフォルトの機能があります（もちろん、JavaScriptを使用して機能を追加することもできます）。

ボタン自体はフォームを送信しません。送信は、ユーザーが送信ボタンをクリックするたびにデフォルトでフォームを送信する一種のボタンですが、JavaScriptを使用して何らかの操作を実行するために使用される単純なボタンです。

IE 8は実際には、送信またはボタンに遭遇した最初のボタンを使用します。入力type = submitにすることで、どちらが望ましいかを簡単に示す代わりに、ページ上の順序が実際に重要です。

type = "submit"の名前付き入力も他のフォームの名前付きフィールドと共に送信されますが、named input type = "button"は送信されないことにも言及する必要があります。

言い換えると、以下の例では、名前の入力がname=button1 ないものとしますという名前の入力ながら提出しますname=submit1 WILL提出します。

サンプルHTMLフォーム（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>

上記のフォームのアクションを処理するPHPスクリプト（checkout.php）：

<?php var_dump($_POST); ?>

/ tmp / test /という名前のフォルダーに2つのファイルを作成し、シェルから組み込みのPHP Webサーバーを実行して、ローカルマシンで上記をテストします。

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

ブラウザでhttp：// localhost：3000を開いて、自分の目で確かめてください。

名前付きボタンを送信する必要があるのはなぜでしょうか。バックエンドスクリプトによって異なります。たとえば、WooCommerce WordPressプラグインは、Place Order名前付きボタンが送信されない限り、投稿されたチェックアウトページを処理しません。タイプを「送信先」から「ボタンに変更」した場合、このボタンは送信されないため、チェックアウトフォームは処理されません。

これはおそらく小さな詳細ですが、悪魔は詳細にあります。

<input type="button">フォーム内だけでなく、どこでも使用でき、フォーム内にある場合はフォームを送信しません。の方がはるかに適していJavascriptます。

<input type="submit">フォームでのみ使用する必要があり、リクエスト（GETまたはPOST）を指定されたURLに送信します。HTMLの場所には配置しないでください。

W3Cは、Button要素に関する仕様を明確にしています

ボタンは、デフォルトの動作がない、あらゆる種類のボタンの汎用クラスと見なされる場合があります。

W3C

type='Submit'バックエンドで値を転送および取得するように設定されています（PHP、.NETなど）。 type='button'通常のボタンの動作を反映します。