<input>タグは、フォーム入力欄を表す際に使用します。
input要素は、type属性の値によって様々なフォームコントロールに変化します。
input要素には、type属性以外にも様々な属性が用意されています。
以下の表は、input要素がどの状態のときに、 コンテンツ属性、IDL属性とメソッド、イベントのどれを適用できるかをまとめたものです。
input要素の状態→
↓使用可能な属性など
|
Hidden | Text, |
URL, |
Date, Week, |
|||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
コンテンツ属性 | |||||||||||||||
accept | · | · | · | · | · | · | · | · | · | · | · | 〇 | · | · | · |
alt | · | · | · | · | · | · | · | · | · | · | · | · | · | 〇 | · |
autocomplete | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 | · | · | · | · | · |
checked | · | · | · | · | · | · | · | · | · | · | 〇 | · | · | · | · |
dirname | · | 〇 | · | · | · | · | · | · | · | · | · | · | · | · | · |
formaction | · | · | · | · | · | · | · | · | · | · | · | · | 〇 | 〇 | · |
formenctype | · | · | · | · | · | · | · | · | · | · | · | · | 〇 | 〇 | · |
formmethod | · | · | · | · | · | · | · | · | · | · | · | · | 〇 | 〇 | · |
formnovalidate | · | · | · | · | · | · | · | · | · | · | · | · | 〇 | 〇 | · |
formtarget | · | · | · | · | · | · | · | · | · | · | · | · | 〇 | 〇 | · |
height | · | · | · | · | · | · | · | · | · | · | · | · | · | 〇 | · |
list | · | 〇 | 〇 | 〇 | · | 〇 | 〇 | 〇 | 〇 | 〇 | · | · | · | · | · |
max | · | · | · | · | · | 〇 | 〇 | 〇 | 〇 | · | · | · | · | · | · |
maxlength | · | 〇 | 〇 | 〇 | 〇 | · | · | · | · | · | · | · | · | · | · |
min | · | · | · | · | · | 〇 | 〇 | 〇 | 〇 | · | · | · | · | · | · |
minlength | · | 〇 | 〇 | 〇 | 〇 | · | · | · | · | · | · | · | · | · | · |
multiple | · | · | · | 〇 | · | · | · | · | · | · | · | 〇 | · | · | · |
pattern | · | 〇 | 〇 | 〇 | 〇 | · | · | · | · | · | · | · | · | · | · |
placeholder | · | 〇 | 〇 | 〇 | 〇 | · | · | 〇 | · | · | · | · | · | · | · |
popovertarget | · | · | · | · | · | · | · | · | · | · | · | · | 〇 | 〇 | 〇 |
popovertargetaction | · | · | · | · | · | · | · | · | · | · | · | · | 〇 | 〇 | 〇 |
readonly | · | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 | · | · | · | · | · | · | · |
required | · | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 | · | · | 〇 | 〇 | · | · | · |
size | · | 〇 | 〇 | 〇 | 〇 | · | · | · | · | · | · | · | · | · | · |
src | · | · | · | · | · | · | · | · | · | · | · | · | · | 〇 | · |
step | · | · | · | · | · | 〇 | 〇 | 〇 | 〇 | · | · | · | · | · | · |
width | · | · | · | · | · | · | · | · | · | · | · | · | · | 〇 | · |
IDL属性とメソッド | |||||||||||||||
checked | · | · | · | · | · | · | · | · | · | · | 〇 | · | · | · | · |
files | · | · | · | · | · | · | · | · | · | · | · | 〇 | · | · | · |
value | default | value | value | value | value | value | value | value | value | value | default/on | filename | default | default | default |
valueAsDate | · | · | · | · | · | 〇 | · | · | · | · | · | · | · | · | · |
valueAsNumber | · | · | · | · | · | 〇 | 〇 | 〇 | 〇 | · | · | · | · | · | · |
list | · | 〇 | 〇 | 〇 | · | 〇 | 〇 | 〇 | 〇 | 〇 | · | · | · | · | · |
select() | · | 〇 | 〇 | 〇※ | 〇 | 〇※ | 〇※ | 〇※ | · | 〇※ | · | 〇※ | · | · | · |
selectionStart | · | 〇 | 〇 | · | 〇 | · | · | · | · | · | · | · | · | · | · |
selectionEnd | · | 〇 | 〇 | · | 〇 | · | · | · | · | · | · | · | · | · | · |
selectionDirection | · | 〇 | 〇 | · | 〇 | · | · | · | · | · | · | · | · | · | · |
setRangeText() | · | 〇 | 〇 | · | 〇 | · | · | · | · | · | · | · | · | · | · |
setSelectionRange() | · | 〇 | 〇 | · | 〇 | · | · | · | · | · | · | · | · | · | · |
stepDown() | · | · | · | · | · | 〇 | 〇 | 〇 | 〇 | · | · | · | · | · | · |
stepUp() | · | · | · | · | · | 〇 | 〇 | 〇 | 〇 | · | · | · | · | · | · |
イベント | |||||||||||||||
input event | · | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 | · | · | · |
change event | · | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 | 〇 | · | · | · |
↑使用可能なイベントなど
input要素の状態→
|
Hidden | Text, |
URL, |
Date, Week, |
<!doctype html>
...
<!doctype html>
...
吾輩は猫である。名前はまだ無い。