ホーム > HTML > フォーム

HTML -フォーム-

フォーム

フォームを作成するための基本タグは、<form>タグです。
form要素の中にテキストボックス、チェックボックス。ボタン等の部品を組み込んでいきます。

<form method="データ送信形式" action="Webサーバ上プログラムパス" > ~ </form>

method属性
post または、getを指定します。
action属性
Webサーバ上のプログラムファイルのパスを指定します。
name属性
フォーム名

<form>タグに記述する主な部品


1行のテキストボックス

<input type="text" name="名前" size="横幅" maxlength="入力可能文字数" />


パスワード

<input type="password" name="名前" size="横幅" maxlength="入力可能文字数" />

入力された内容は、「*」で表示されます。


複数行のテキストボックス

<textarea name="名前" cols="1行分の文字数" rows="行数" />

cols属性値とrows属性値は、省略することはできません。


チェックボックス

<input type="checkbox" name="名前" value="文字列1に対する値" />文字列1

アンケート等で複数回答させたい場合などに使用します。

初期値を指定する場合は、checked属性を使用します。

サンプル
<input type="checkbox" name="fruit" value="1" checked="checked"/>りんご
<input type="checkbox" name="fruit" value="2" />みかん
<input type="checkbox" name="fruit" value="3" />もも

ラジオボタン

<input type="radio" name="名前" value="文字列1に対する値" />文字列1

単一の回答等を得る場合に使用します。

初期値を指定する場合は、checked属性を使用します。

サンプル
<input type="radio" name="fruit" value="1" checked="checked"/>りんご
<input type="radio" name="fruit" value="2" />みかん
<input type="radio" name="fruit" value="3" />もも

セレクトボックス

<selct name="名前" >
    <option value="文字列1に対する値" >文字列1</option>
    <option value="文字列2に対する値" >文字列2</option>
        ~
<selct>

プルダウンメニューを作成する場合に使用します。

初期値を指定する場合は、selected属性を使用します。

サンプル
<select neme="fruit">
    <option value="1" selected="selected">りんご</option>
    <option value="2">みかん</option>
    <option value="3">もも</option>
</select>

隠しフィールド

<input type="hidden" name="名前" value="値" />

ユーザが、値を変更できません。
システム情報や複数のページにまたがって保持したい情報などの受け渡しに使用します。


送信ボタン

<input type="submit" value="ボタンに表示する文字列" />


リセットボタン

<input type="reset" value="ボタンに表示する文字列" />


ボタン

<input type="button" value="ボタンに表示する文字列" />


ファイルアップロード

<input type="file" name="名前" />