★タグ
●formタグ
・・・入力・送信フォームを作るときに使うタグです。
●action属性
・・・formの送信先を指定します。ここで指定したURLに送信されます。
●method属性・・・formの送信方法です。getとpostがありますがデータ、セキュリティからみてpostがいいのでmethod="post"で行きましょう。
●inputタグ
・・・formタグの中にテキストを入力したり、ボタン的なものを作ったりするときに使います。
<input type="~">
的な書き方をします。
○type属性の種類
■text・・・一行のテキスト(文字)ボックスを作成する。
<form>名前:<input type="text" name="項目名" value="初期値(変更可)" size="10" maxlength="10"/></form>
で
になります。
sizeは文字数?(※正確ではないらしです。)長さかな?
maxlengthは最大文字数を表しています。
■password・・・パスワード入力欄を作成する。たぶん半角英数字しか使えないです。
<form>パスワード:<input type="password" /></form>で
になります。
■image・・・イメージの送信ボタンを作成します。
<form><input type="image" src="画像までのパス" alt="画像の代わりになるテキストを指定" /></form>
になります。(時間がないのでキラキラ画像を送信ボタンにしてみました。)
■file・・・ファイル名入力ボックスを作成します。
<form><p><input type="file" name="datafile" /></p><p><input type="submit" value="送信" /></p></form>
になります。
■checkbox・・・チェックボックスボタンを作成します。複数のボタンを選択できます。
<form><input type="checkbox" name="color1" value="red"/>赤<input type="checkbox" name="color2" value="bule" />青</form>で
になります。複数個選択できます。
checkedでボタン指定できます。
■radio・・・ラジオボタンを作成します。一個のボタンしか選択できません。
<form><input type="radio" name="color1" value="red"/>赤<input type="radio" name="color1" value="bule" />青</form>で
になります。一つしか選択できません。したがって使うときは普通2個以上使います。
■subumit・・・送信ボタンを作成します。
<form><input type="submit" value="送信" /></form>で
になります。velue属性名がボタンに表示されます。
■reset・・・リセットボタンを作成します。
<form>名前:<input type="text" /><input type="reset" value="リセット" /></form>で
になります。value属性名がボタンに表示されます。
●
textareaタグ・・・複数行のテキストボックスの作成です。
<form><p>コメント<br /><textarea name="comment "rows="5" cols="30">らーめん食べたい</textarea></form>で
になります。rowsで何行、colsで一行の文字数を指定します。name名は送信先のメールで
[comment]
らーめん食べたい
みたいな感じで表示されます。
●
selectタグ・・・セレクトボックスを作成するタグです。初期値ではプルダウン式になっており、size属性で指定する事でプルダウン式じゃなくすることも可能です。selectタグの中にoptionタグを入れることで作れます。
<form><select name="color" multiple="multiple" ><option value="red">赤[red]<option value="green" selected="selected">緑[green]<option value="bule">青[bule]</select></form>で
になります。selectの開始タグにsize属性を入れればプルダウン式じゃなくせます。
selectedは選択された状態を指定します。selectedを緑に設定したので緑[green]が設定されます。
multiple属性は複数個選択できる用意する属性です。(Ctrlキーを押しながらクリックするとできます。)
赤を選んだ場合、
name=color,value="red"なので。送信したらメールには
[color]
red
と送信されてきます。
<input type="hidden" name="項目名" value="値(変更不可)" />
hiddenは隠し項目です。したがってブラウザには表示されません。
PHPと絡んでくると思われるので後でちゃんとやろうと思います。
formタグは1ページに複数個使えます。<form>~</form>ので一つのformです。
↓id名、class名に困ったときは・・・
有名サイトが使っているid名class名集めてきました!
PR