入力タグを使用してフォームを送信する
HTMLフォームは、インタラクティブ機能をWebサイトに追加するための最も基本的な方法の1つです。 質問をしたり、読者から回答を求めたり、データベースから追加情報を提供したり、ゲームを設定したりすることができます。 フォームを構築するために使用できるいくつかのHTML要素があります。 フォームを作成したら、そのデータをサーバーに送信するか、フォームアクションの実行を開始するだけでさまざまな方法があります。
フォームを送信する方法はいくつかあります。
-
- これは、サーバーにデータを取得する最も一般的な方法ですが、非常に単純に見える可能性があります。
-
- イメージを使用すると、送信ボタンをサイトのスタイルに合わせやすくすることができます。 しかし、送信ボタンとして認識しない人もいます。
-
- ボタンのINPUTタグは、画像のINPUTタグと同じオプションをたくさん提供しますが、標準の送信タイプによく似ています。 有効にするにはJavaScriptが必要です。
- <コマンドタイプ= "コマンド">
- COMMAND要素はHTML5で新しく追加されたアクションを使ってスクリプトやフォームをアクティブにする方法を提供します。 これはJavaScriptでアクティブになります。
INPUT要素
INPUT要素は、フォームを送信する最も一般的な方法です。タイプ（ボタン、イメージ、またはサブミット）を選択し、必要に応じてフォームアクションにサブミットするスクリプトを追加するだけです。
要素は、そのように書くことができます。 しかし、そうした場合、ブラウザによって異なる結果になります。 ほとんどのブラウザは「送信」と言うボタンを作成しますが、Firefoxは「Submit Query」というボタンを作成します。ボタンの内容を変更するには、属性を追加する必要があります。
value = "フォームを送信">
要素はそのように書かれていますが、他の属性をすべて残しておくと、ブラウザに表示されるのは空白の灰色のボタンになります。 ボタンにテキストを追加するには、value属性を使用します。 JavaScriptを使用しない限り、このボタンはフォームを送信しません。
onclick = "submit（）;">
フォームはフォームを送信するためのスクリプトが必要なボタンタイプに似ています。 テキスト値の代わりに、イメージソースURLを追加する必要があります。
src = "submit.gif">
ボタン要素
BUTTON要素には、開始タグと終了タグの両方が必要です。タグを使用すると、タグ内に囲まれたコンテンツはすべてボタンで囲まれます。 次に、スクリプトでボタンをアクティブにします。
フォームを送信
ボタンに画像を含めたり、画像とテキストを組み合わせてより面白いボタンを作成することができます。
フォームを送信
COMMAND要素
COMMAND要素はHTML5で新しく追加されました。 フォームを使用する必要はありませんが、フォームの送信ボタンとして機能することができます。 この要素を使用すると、フォームを必要としない限り、フォームを必要とせずにインタラクティブなページをさらに作成できます。 コマンドに何かを伝えるには、ラベル属性に情報を書きます。
label = "フォームを送信">
イメージでコマンドを表現する場合は、icon属性を使用します。
icon = "submit.gif">
この記事は、 HTMLフォームチュートリアルの一部です。 HTMLフォームを使用する方法については、チュートリアル全体をお読みください。
HTMLフォームには、前のページで学習したように、いくつかの異なる提出方法があります。 これらのメソッドのうちの2つは、INPUTタグとBUTTONタグです。 これらの要素の両方を使用する理由があります。
INPUT要素
タグはフォームを送信する最も簡単な方法です。 それはタグ自体を超えて何も必要とせず、値でさえありません。 顧客がボタンをクリックすると、自動的に送信されます。 スクリプトを追加する必要はなく、送信INPUTタグがクリックされたときにブラウザがフォームを送信することがわかっています。
問題は、このボタンが非常に醜いと平凡なことです。 画像を追加することはできません。 他の要素と同じようにスタイルを設定できますが、まだ醜いボタンのように感じることができます。
JavaScriptがオフになっているブラウザでもフォームにアクセスできるようにするには、INPUTメソッドを使用します。
ボタン要素
BUTTON要素には、フォームを送信するためのより多くのオプションが用意されています。 BUTTON要素の中に何かを入れて、送信ボタンにすることができます。 最も一般的には、画像とテキストを使用します。 しかし、あなたはDIVを作成し、あなたが望むならばそのボタン全体を送信ボタンにすることができます。
BUTTON要素の最大の欠点は、フォームを自動的に提出しないことです。 これは、それを有効にするためのいくつかのタイプのスクリプトが必要であることを意味します。 そして、それはINPUTメソッドよりアクセスしにくいです。 JavaScriptをオンにしていないユーザーは、BUTTON要素のみを含むフォームを送信して送信することはできません。
重要ではないフォームでは、BUTTONメソッドを使用します。 また、これは1つのフォーム内に追加の提出オプションを追加するのに最適な方法です。
この記事は、 HTMLフォームチュートリアルの一部です。 HTMLフォームを使用する方法の詳細は、こちらを参照してください。