“input”要素~“type="submit"”

“type="submit"”

“type="submit"”を指定した“input”要素は入力フォームの送信ボタンを表します。

“type="submit"”を指定した“input”要素はクリックされたときに関連付けられた“form”要素の入力内容を送信します。

“name”属性で指定した場合は“name”属性の値とともに“value”属性の値がフォームを送信したときに送信されます。

“value”属性を指定した場合、“value”属性の値がボタンのラベルになります。“value”属性でラベルを指定しない場合は“送信”などのブラウザのデフォルトのラベルがつけられます。

“type="submit"”を指定した“button”要素と同じ機能を持ちます。

サンプルコード

送信ボタン

<form method="post" action="sample-inputtag2.php" target="_blank">

<fieldset>

<label>猫の色：

<select name="sample01">

<option value="白猫">白猫</option>>
<option value="黒猫">黒猫</option>
<option value="白黒猫">白黒猫</option>
<option value="キジトラ猫">キジトラ猫</option>
<option value="茶トラ猫">茶トラ猫</option>
<option value="三毛猫">三毛猫</option>
<option value="ほかの猫">ほかの猫</option>

</select>

</label>

</fieldset>
<p>

<input type="submit">
<input type="reset">

</p>

</form>

猫の色： 白猫> 黒猫 白黒猫 キジトラ猫 茶トラ猫 三毛猫 ほかの猫

＊送信すると入力内容が表示されます。

ボタン自体に入力値を送信させる

<form method="post" action="sample-inputtag2.php" target="_blank">

<fieldset>

<legend>好きな猫を選んでください：</legend>
<p>

<input type="submit" name="sample01" value="白猫">
<input type="submit" name="sample01" value="黒猫">
<input type="submit" name="sample01" value="白黒猫">
<input type="submit" name="sample01" value="キジトラ猫">
<input type="submit" name="sample01" value="茶トラ猫">
<input type="submit" name="sample01" value="三毛猫">
<input type="submit" name="sample01" value="ほかの猫">

</p>

</fieldset>

</form>

好きな猫を選んでください：

＊送信すると入力内容が表示されます。

属性と値

属性		値
属性	説明	値	説明
必須属性
type=""	入力欄の種類	submit	送信ボタン
任意属性
グローバル属性
disabled=""	入力欄を無効化	disabled	入力欄を無効化
form=""	関連付けるフォーム	ID名	関連づける“form”要素の“id”属性の値
formaction=""	フォームに入力されたデータの送信先	URL	フォームに入力されたデータの送信先のURL
formenctype=""	フォームが送信するデータの形式	application/x-www-form-urlencoded	入力されたデータをURLエンコードして送信
		multipart/form-data	入力されたデータをマルチパートデータとして送信
		text/plain	入力されたデータをプレーンテキストとして送信
formmethod=""	フォームを送信時のHTTPメソッド	get	入力されたデータを“action”属性で指定したURLにクエリ文字列として付加して送信
		post	入力されたデータをHTTPリクエストの本文として送信
		dialog	フォームの送信時に“form”要素が含まれる“dialog”要素を閉じる
formnovalidate=""	フォームの送信時に入力内容の妥当性をチェックしない	formnovalidate	フォームの送信時に入力内容の妥当性をチェックしない
formtarget=""	フォームの送信時の応答画面の表示方法	_blank	新しいブラウジング・コンテキストに表示
		_self	現在のブラウジング・コンテキストに表示
		_parent	現在のブラウジング・コンテキストの1つ上位のブラウジング・コンテキストに表示
		_top	現在のブラウジング・コンテキストの最上位のブラウジング・コンテキストに表示
		ブラウジング・コンテキスト名	任意のブラウジング・コンテキストに表示
name=""	入力欄の名前	文字列	入力欄の名前
popovertarget=""	表示状態を切り替えるポップオーバー要素	ID名	表示状態を切り替えるポップオーバー要素の“id”属性の値
popovertargetaction=""	ポップオーバー要素の表示状態の切り替え方法	toggle	ポップオーバー要素の表示状態を切り替える
		show	ポップオーバー要素を表示する
		hide	ポップオーバー要素を閉じる
value=""	ボタンに表示されるラベル	テキスト	ボタンに表示されるラベル

仕様書

submit