タイトル

<form>

formタグは特殊です。主にアンケートや、電子メールなどに 出力するのに使用します。
ＣＧＩの改造にも有効です。
これで、他のプログラムにデータが渡せます。
以下のすべての物は<form>から</form>で挟まなければ意味がありません。
<form>から</form>の中に挟まれている物だけが送信されます。

<form>タグ
actionで、引き渡すデータを指定。（cgiなど）mailtoで、 メーラーを使ってメールを送信させる。
<form action="mailto:moon@night.104.net">
この中に他のタグを入れる
</form>

同じページに複数の入力エリアを作る場合（この方が一般的だが） それぞれ違うname属性を付けて分ける。
例）<input type="text" name="name">
同じname属性を付けても送れる（はずだ）が、送られたデータを見るときにわかりづらい。
name属性は一つでも付ける。
name属性を付けないとデータを引き渡さない（送らない）。
日本語も使えるが、文字化けする可能性がある。

テキストエリア
<input type="text">

テキストエリア広さ調整
サイズを設定しないと20になる。
<input type="text" size="50">

テキスト字数制限
<input type="text" maxlemgth="8">

この場合、IEだと8文字まで。NNだと8バイトまで。

初期値
value属性で初期値設定。
<input type="text" value="名前はここに">

初期値自動クリア （IEのみ）
テキストボックスに入力しようとすると、テキストが消える。
<input type="text" value="いつもここから" Onfocus="value=''">

入力禁止 （IEのみ）
disabledで入力禁止。
<input type="text" value="初期値" disabled>

入力非表示
入力文字が*になる。パスワード入力等に使用。
<input type="password" size="20">

文章入力
<textarea>
</textarea>

文章入力サイズ指定
<textarea rows="5" cols="50">
</textarea>

文章入力初期値設定
<textarea>
文字を挟むと中に入ります。
</textarea>

文章自動改行
<textarea wrap="off">
wrap="offを指定すると、文章が端で折り返さなくなります。
改行はそのまま
</textarea>

IEだとデフォルトはwrap="soft"（自動改行する）になっています。
NNだとデフォルトはwrap="off"（自動改行しない）になっています。

文章入力禁止 （IEのみ）
<textarea readonly>
readonly指定すると
書き込めません
</textarea>

ラジオボタン
type=radioでラジオボタンになる。nameを同じにするとその中の一つしかチェックできない。
checkedを付けると、そこに最初からチェックがついている。
valeu属性を付けないと、送信されたときに何にチェックがされたかわからない。
<input type="radio" name="a" value="オーバードライブ" checked>オーバードライブ
<input type="radio" name="a" value="ルート３３">ルート３３
<input type="radio" name="a" value="北陽's">北陽's
オーバードライブ ルート３３ 北陽's

チェックボックス
type=checkboxでチェックボックスになる。
valeu属性を送信する。valeuがないとon/offが送られる。
checkedを付けておくと、最初からチェックされている。
<input type="checkbox" name="A" value="それ行け" checked>それ行け
<input type="checkbox" name="B" value="アンパン">あんぱん
<input type="checkbox" name="C" value="かび">かび
それ行け あんぱん かび

プルダウン
<select name="TEL">
<option>選んでね
<option >ASTEL
<option>DDI
<option>DoCoMo
<option>cdmaOen
<option>bell
</select>

プルダウン広さ
sizeで、行数指定。
selectedを付けると、そこが初期選択されている。
valeu属性を付けると、それが正となり送られる。（選択肢の表記は無視される）
<select name="TEL" size="4">
<option value="tel">選んでね
<option value="ASTEL" selected>ASTEL
<option value="DDI">DDI
<option value="DoCoMo">DoCoMo
<option value="cdmaOen">cdmaOen
<option value="bell">bell
</select>

プルダウン複数選択
multipleを付けると、Ctrlキーを押しながら選択すると複数選択が出来る。
<select size="6" multiple>
<option>選んでね
<option selected>ASTEL
<option>DDI
<option>DoCoMo
<option selected>cdmaOen
<option>bell
</select>

不可視属性
type=hiddenとすると、表面上は表示されないが、送信はされる。
<input type="hidden" name="A" valeu="B">

終了後処理
送信し終わったら指定のページに飛ばす。
飛べるか未確認・・・
<input type="hidden" name="location" value="test.html">

テキストボタン （IEのみ）
テキストを押してもチェック出来る。
<INPUT TYPE="checkbox" ID="1">
<LABEL FOR="1">ここをクリック<LABEL>

ボタン （IEのみ）
画像もボタンに埋め込める。
フォントタグを使えば色も付けられる。
<BUTTON name="submit" type="submit">
<IMG SRC="./cg/test.png"><LABEL>

ＯＫボタン
valeuで、ボタンの表示文字を変える。
<input type="submit" value="OK">

クリアボタン
<input type="reset" value="クリア">

メールに送信
<form method="post" action="mailto:moon@night.104.net" enctype="text/plain">
<p>名前を入れてね</p>
<input type="text" name="A">
<input type="submit" value="送信">
<input type="reset" value="クリア">
</form>

名前を入れてね

前へ戻る 表紙に行く 次へ進む