フォーム関連  next


●フォームを使って入力欄を作る

<form></form>

formとはページ上でアンケート入力等を作る事ができるスペースで  情報が送信出来るボタン等も 作成できます
formにはいくつかのタイプがあります そのうちの基本だけ載せました  入力欄は全てこの form タグで囲みます


FORM見本
 一行テキスト入力欄

記入例:
<form>
<input type="text" size="
記入欄の横の文字数" name="適当な名前">
</form>

name=" " はここに記入された内容(データ)が何についてのものか?という指定です
この指定はデータを受け取るときに必要となります
例えば
お名前の記入欄には name="name"
ページのURL記入欄なら name="url"
メールアドレス記入欄なら name="mail"
などのように 自分でわかるような名前をつけます
ここでは name="一行テキスト"name="複数テキスト" になっています(安易)(爆)
size=" "" "の中には半角数字を入れます 入力欄の横の文字数です
上記例では40になってます 増やすと広がり減らすと縮まります



 複数行のテキスト入力欄
記入例:
<form>
<textarea rows="
記入欄の縦の行数" cols="記入欄の横の文字数" name="適当な名前">
</textarea>
</form>

rows=" "" "の中には半角数字を入れます 入力欄の縦の行数です
cols=" "" "の中には半角数字を入れます 入力欄の横の文字数です
上記例では rows="8" cols="40" になってます 増やすと広がり減らすと縮まります
name欄については上の一行テキストを参照してください

ラジオボタンの見本です(一個しか選べません)
 ♪好きな人を選んでね
たくや しんご つよし
記入例:
♪好きな人を選んでね<br>
<form>
たくや<input type="radio" name="ボタン" value="たくや"><br>
しんご<input type="radio" name="ボタン" value="しんご"><br>
つよし<input type="radio" name="ボタン" value="つよし"><br>
</form>
 
チェックボックスの見本です(複数選べます)
 ♪好きな人を選んでね
たくや しんご つよし
記入例:
♪好きな人を選んでね<br>
<form><
たくや<input type="checkbox" name="チェック" value="たくや"><br>
しんご<input type="checkbox" name="チェック" value="しんご"><br>
つよし<input type="checkbox" name="チェック" value="つよし"><br>
</form>
name=" "value=" " には 自分で後で見てわかるものを入れます


  送信とリセットボタン
サンプルですので実際には送信しません
フォームに記入された内容を送信する送信ボタンの作り方
記入例:
<form method="post" action="mailto:****@***.**.**" ENCTYPE="text/plain">
ここにラジオボタンやチェックボックスやテキストフォームなど好きなものを置く たとえば
<input type="text" size="記入欄の横の文字数" name="適当な名前">
などとする
<input type="submit" value="送信する">  <input type="reset" value="リセット">
</form>

 ****@***.**.** には宛先にしたいメールアドレスを入れます
 ako@nihonkai.com に送信する場合は
 <form method="post" action="mailto:ako@ako.nihonkai.com" ENCTYPE="text/plain">
と書きます   これが実際送信されてくると 以下のようになってきます
 一行テキスト=akoさんはいい女(一行テキストに記入した内容です)
 複数テキスト=やさしいakoさん
 きれいなakoさん
 素敵なakoさん(複数行テキストに記入した内容です)
 ボタン=たくや(ラジオボタンで選んだ内容です)
 チェック=つよし(チェックボックスで選んだ内容です)
ここにおいて上記の namevalue が重要になってくるわけで
ボタン=たくや等となってくるので 何が押されたか自分にわかるわけです


さて 何がなんだかわからなくなっちゃいましたね それでは単純に
以下に一行テキストとそれに書いた内容を送信する書き方を まとめて書いておきます
<form method="post" action="mailto:あなたのメールアドレス" ENCTYPE="text/plain">
<input type="text" size="
40" name="text">
<input type="submit" value="送信する"> </form>

赤で書かれた部分が貴方が書きかえる部分です
:お使いになっているブラウザ(IE NetScape他)に ご使用のメールソフトが
標準に設定されていない場合  送信できないことがあります
又 メーラーを立ち上げておかないと送信できない場合もあります


Copyright ako's cyberpage All rights reserved