Form: INPUT
記述形式
<FORM>
<INPUT option>
[ NN2,3,4,6,7 | IE2,3,4,5,6 ]
</FORM>
使用方法
使用例
<FORM ACTION="???" METHOD="post">
お名前:<INPUT TYPE="text" NAME="name"><BR>
e-mail:<INPUT TYPE="text" NAME="e-mail" SIZE="30"><BR>
コメント:<INPUT TYPE="text" NAME="comment" SIZE="50" MAXLENGTH="100" VALUE="コメントを入力して下さい"><BR>
<BR>
性別:<INPUT TYPE="radio" NAME="sex" VALUE="man" CHECKED>男性
<INPUT TYPE="radio" NAME="sex" VALUE="women">女性<BR>
<BR>
ご使用のブラウザをチェックして下さい。(複数選択可)
<INPUT TYPE="checkbox" NAME="browser" VALUE="Netscape" CHECKED>NetscapeNavigator<BR>
<INPUT TYPE="checkbox" NAME="browser" VALUE="Explorer">InternetExplorer<BR>
<INPUT TYPE="checkbox" NAME="browser" VALUE="other">その他<BR>
<BR>
<INPUT TYPE="submit" VALUE="送信">
<INPUT TYPE="reset" VALUE="クリア">
</FORM>
[注意]:このFORMはACTION先を記述していませんので動作しません。
option attribute
- TYPE attribute
- テキストボックスを設定する
<INPUT TYPE="text">
[ NN2,3,4,6,7 | IE2,3,4,5,6 ]
- パスワードボックスを設定する
<INPUT TYPE="password">
[ NN2,3,4,6,7 | IE2,3,4,5,6 ]
TYPE="text"との違いは入力時にテキストがアスタリスク(*)になります。
- ラジオボタンを設定する
<INPUT TYPE="radio">
[ NN2,3,4,6,7 | IE2,3,4,5,6 ]
- チェックボックスを設定する
<INPUT TYPE="checkbox">
[ NN2,3,4,6,7 | IE2,3,4,5,6 ]
- フォーム内のデータを送信するボタンを設定する
<INPUT TYPE="submit">
[ NN2,3,4,6,7 | IE2,3,4,5,6 ]
- フォーム内のデータをクリアするボタンを設定する
<INPUT TYPE="reset">
[ NN2,3,4,6,7 | IE2,3,4,5,6 ]
- 任意の動作を行うボタンを設定する
<INPUT TYPE="button" VALUE="送信">
[ NN2,3,4,6,7 | IE2,3,4,5,6 ]
- 隠しフィールドを設定する
<INPUT TYPE="hidden">
[ NN2,3,4,6,7 | IE2,3,4,5,6 ]
ブラウザには表示されませんが、データを送信したときに内容が送られます。
- 画像を送信ボタンとして設定する
(イメージマップ)
<INPUT TYPE="image" SRC="image file URL">
[ NN2,3,4,6,7 | IE2,3,4,5,6 ]
- ファイルを送信 ( UpLoad ) する
<INPUT TYPE="file" NAME="name">
[ NN2,3,4,6,7 | IE3,4,5,6 ]
- 入力されたデータに名前を付けて管理する
<INPUT TYPE="***" NAME="name">
[ NN2,3,4,6,7 | IE2,3,4,5,6 ]
- テキスト・パスワードボックスの横サイズを指定する
<INPUT TYPE="text | password" SIZE="num">
[ NN2,3,4,6,7 | IE2,3,4,5,6 ]
TYPE="text | password"の場合にのみ指定できます。
munには半角換算した文字数を入れます。
- テキスト・パスワードボックスの入力可能な最大文字数を指定する
<INPUT TYPE="text | password" MAXLENGTH="num">
[ NN2,3,4,6,7 | IE2,3,4,5,6 ]
TYPE="text | password"の場合にのみ指定できます。
munには半角換算した文字数を入れます。
- VALUE attribute
<INPUT TYPE="***" VALUE="comment">
[ NN2,3,4,6,7 | IE2,3,4,5,6 ]
TYPE="text | hidden"では初期状態でテキストボックスに表示するテキストを指定します。
TYPE="checkbox"ではサーバーに送られるテキストを指定します。
TYPE="submit | reset | button"ではボタンに表示されるテキストを指定します。
- ラジオボタン・チェックボックスの項目を初期状態からチェックしておく。
<INPUT TYPE="radio | checkbox" CHECKDE">
[ NN2,3,4,6,7 | IE2,3,4,5,6 ]
- 送信するデータのContent-Typeを設定する
<INPUT TYPE="***" ACCEPT="Content-Types">
[ nothing ]
- アクセスキーを指定する
<INPUT TYPE="***" ACCESSKEY="*">
[ NN6,7 | IE4,5,6 ]
例えば、ACCESSKEY="x" を指定しているフィールドはキーボードの [ALT+X] を
押すとフォーカスがこのフィールドに移る。
- TABキーを押すことでフォーカスが移動する順番を指定する
<INPUT TYPE="***" TABINDEX="num">
[ NN6,7 | IE4,5,6 ]
num には 0 ~ 32767 の間で数値を指定できます。
- 表示位置を指定する
<INPUT TYPE="image" ALIGN="left | right | center | justify">
[ NN2,3,4,6,7 | IE2,3,4,5,6 ]
NN , IE ともに justify を認識しません。
- 画像を表示できないブラウザのため代替えテキストを表示させる
<INPUT TYPE="image" ALT="comment">
[ NN6,7 | IE4,5,6 ]
- テキスト・パスワードボックスを読み取り専用(Read-Only)にする
<INPUT TYPE="text | password" VALUE="comment" READONLY>
[ NN6,7 | IE4,5,6 ]
VALUEで指定したテキストを改ざんすることができなくなります。
- クライアントからの入力を受け付けなくさせる
<INPUT TYPE="***" DISABLED>
[ NN6,7 | IE4,5,6 ]
- 複数のタグで同一の名称(例えばHEAD部のCSS要素)を使用する
<INPUT TYPE="***" CLASS="name">
[ NN4,6,7 | IE3,4,5,6 ]
- フィールドに名称を付ける
<INPUT TYPE="***" ID="name">
[ NN4,6,7 | IE4,5,6 ]
- スタイル属性を定義する
<INPUT TYPE="***" STYLE="property">
[ NN4,6,7 | IE3,4,5,6 ]
- タグに付加的情報を付ける
<INPUT TYPE="***" TITLE="comment">
[ NN6,7 | IE4,5,6 ]
- 言語を指定する
<INPUT TYPE="***" LANG="language">
[ IE4,5,6 ]
- テキストの読み方向を指定する
<INPUT TYPE="***" DIR="ltr | rtl">
[ NN6,7 | IE5,6 ]
- 入力可能状態になったときにスクリプト処理を行う
<INPUT TYPE="text" onFocus="処理 | 関数名">
[ NN2,3,4,6,7 | IE3,4,5,6 ]
- 入力が終了し、他の部品にフォーカスが移ったときにスクリプト処理を行う
<INPUT TYPE="text" onBlur="処理 | 関数名">
[ NN2,3,4,6,7 | IE3,4,5,6 ]
- テキスト・パスワードボックスが書きかえられたときにスクリプト処理を行う
<INPUT TYPE="text | password" onChange="処理 | 関数名">
[ NN2,3,4,6,7 | IE3,4,5,6 ]
- テキスト・パスワードボックスの文字を選択したときにスクリプト処理を行う
<INPUT TYPE="text | password" onSelect="処理 | 関数名">
[ NN2,3,4,6,7 | IE4,5,6 ]
ボックス内の文字をドラッグして反転表示にさせたときに発生します。
- 指定部分をクリックしたときにスクリプト処理を行う
<INPUT TYPE="radio | checkbox | button | reset" onClick="処理 | 関数名">
[ NN2,3,4,6,7 | IE3,4,5,6 ]
- 指定部分をダブルクリックしたときにスクリプト処理を行う
<INPUT TYPE="***" onDblclick="処理 | 関数名">
[ NN4,6,7 | IE4,5,6 ]
- 指定部分の上でマウスのキーを押し下げたときにスクリプト処理を行う
<INPUT TYPE="***" onMousedown="処理 | 関数名">
[ NN4,6,7 | IE4,5,6 ]
- 指定部分の上でマウスのキーを上げた(元に戻した)ときにスクリプト処理を行う
<INPUT TYPE="***" onMouseup="処理 | 関数名">
[ NN4,6,7 | IE4,5,6 ]
- マウスポインタが指定部分の上に載ったときにスクリプト処理を行う
<INPUT TYPE="***" onMouseover="処理 | 関数名">
[ NN2,3,4,6,7 | IE3,4,5,6 ]
- マウスポインタが指定部分から外れたときにスクリプト処理を行う
<INPUT TYPE="***" onMouseout="処理 | 関数名">
[ NN3,4,6,7 | IE4,5,6 ]
- マウスポインタが指定部分の上で移動しているときにスクリプト処理を行う
<INPUT TYPE="***" onMousemove="処理 | 関数名">
[ NN4,6,7 | IE4,5,6 ]
- 指定部分の上でキーボードのキーを押し下げたときにスクリプト処理を行う
<INPUT TYPE="***" onKeydown="処理 | 関数名">
[ NN4,6,7 | IE4,5,6 ]
- 指定部分の上でキーボードのキーを上げた(元に戻した)ときにスクリプト処理を行う
<INPUT TYPE="***" onKeyup="処理 | 関数名">
[ NN4,6,7 | IE4,5,6 ]
- 指定部分の上でキーボードのキーを押し下げた状態のときにスクリプト処理を行う
<INPUT TYPE="***" onKeypress="処理 | 関数名">
[ NN4,6,7 | IE4,5,6 ]