HTMLInputElement
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
HTMLInputElement
インターフェイスは <input>
要素のオプション、レイアウト、表示方法を操作するための特別なプロパティやメソッドを提供します。
インスタンスプロパティ
親インターフェイスである HTMLElement
から継承したプロパティもあります。
一部のプロパティは、対応する属性を持つ入力要素の型にのみ適用されます。
align
非推奨;-
文字列で、要素の配置を表します。代わりに CSS を使用してください。
defaultValue
-
文字列で、このオブジェクトが生成された際にもともと HTML で指定されていた既定値を表します。
dirName
-
文字列で、この要素の書字方向を表します。
incremental
非標準-
論理値で、検索イベントの発生モードを表します。
true
の場合、キーが押されるたび、またはキャンセルボタンをクリックしたときに発生し、それ以外の場合は Enter を押したときに発生します。 labels
読取専用-
この要素のラベルである
<label>
のリストを返します。 list
読取専用-
list
属性が指す要素を返します。同じツリーに HTML 要素が見つからなかった場合、プロパティはnull
になることがあります。 multiple
-
論理値で、この要素の
multiple
属性を表します。これは複数の値(例えば複数のファイル)を持つことが可能であるかどうかを示します。 name
-
文字列で、この要素の
name
属性を表します。ここにはフォーム送信時にその要素を識別する名前が入ります。 popoverTargetAction
-
<input>
要素のtype="button"
型で制御されるポップオーバー要素で実行されるアクション("hide"
、"show"
、"toggle"
のいずれか)を取得および設定します。これはpopovertargetaction
という HTML 属性の値を反映します。 popoverTargetElement
-
<input>
要素のtype="button"
型で制御されるポップオーバー要素を取得および設定します。これは JavaScript でpopovertarget
という HTML 属性に相当するものです。 step
-
文字列で、この要素の
step
属性を表します。これは、min
やmax
と共に、数値や日時の値を設定する際の増分を制限します。文字列any
または正の浮動小数点数を設定することができます。any
が設定されていない場合、コントロールは最小値よりも大きい step 値の倍数のみを受け入れます。 type
-
文字列で、この要素の
type
属性を表します。これは表示するコントロールの型を示します。利用可能な値についてはtype
属性のドキュメントを参照してください。 useMap
非推奨;-
文字列で、クライアント側イメージマップを表します。
value
-
文字列で、そのコントロールの現在の値を表します。ユーザーが予期しない値を入力した場合、これは空文字列を返すことがあります。
valueAsDate
-
Date
で、要素の値を日付として解釈して表します。変換できない場合はnull
となります。 valueAsNumber
-
数値で、この要素の値を解釈したものを表します。解釈は、時刻、数値の順で行われ、変換できなければ
NaN
となります。
親フォームに関連するインスタンスプロパティ
form
読取専用-
親の
<form>
要素の参照を返します。 formAction
-
文字列で、この要素の
formaction
属性を表します。ここには要素によって送信された情報を処理するプログラムの URI が入ります。これは親フォームのaction
属性を上書きします。 formEnctype
-
文字列で、この要素の
formenctype
属性を表します。ここにはフォームをサーバーに送信する際のコンテンツの型が入ります。これは親フォームのenctype
属性を上書きします。 formMethod
-
文字列で、この要素の
formmethod
属性を表します。ここにはブラウザーがフォームを送信する際に用いる HTTP メソッドが入ります。これは親フォームのmethod
属性を上書きします。 formNoValidate
-
論理値で、この要素の
formnovalidate
属性を表します。これは送信時にそのフォームが検証されないかどうかを示します。これは親フォームのnovalidate
属性を上書きします。 formTarget
-
文字列で、この要素の
formtarget
属性を表します。ここにはフォームを送信した後で受け取ったレスポンスを表示する場所を示す名前またはキーワードが入ります。これは親フォームのtarget
属性を上書きします。
hidden 以外の任意の型の入力要素に適用されるインスタンスプロパティ
disabled
-
論理値で、この要素の
disabled
属性を表します。これはそのコントロールが対話を受け付けないかどうかを示します。その入力値はフォームとともに送信されません。readonly
もご覧ください。 required
-
論理値で、この要素の
required
属性を表します。これは、フォームを送信する前にユーザーが値を入力しなければならないかどうかを示します。 validationMessage
読取専用-
そのコントロールが制約を満たしていない場合、それを記述したローカライズされたメッセージを返します(もしあれば)。これは、コントロールが制約検証の候補ではない場合(
willValidate
がfalse
の場合)、または制約を満たしている場合は空の文字列です。この値は、setCustomValidity()
メソッドで設定できます。 validity
読取専用-
この要素の現在の検証状態を返します。
willValidate
読取専用-
その要素が制約検証の候補であるかどうかを返します。これは何か制約検証を阻む条件がある場合、例えば、
type
がhidden
、reset
、button
のいずれかである、祖先に<datalist>
がある、disabled
プロパティがtrue
である、などです。
checkbox または radio 型の要素にのみ適用されるプロパティ
checked
-
論理型で、この要素の現在の状態を表します。
defaultChecked
-
論理型で、このオブジェクトを生成した HTML でもともと指定されていたラジオボタンまたはチェックボックスの既定の状態を表します。
indeterminate
-
論理型で、チェックボックスやラジオボタンの状態が不確定であるかどうかを返します。チェックボックスの場合は、その状態が不確定 (チェックでも未チェックでもない状態) であることを示すために、チェックボックスの外観が何らかの方法で不明瞭になったり、灰色になったりする効果があります。
checked
属性の値には影響を与えず、チェックボックスをクリックするとその値は false になります。
image 型の要素にのみ適用されるプロパティ
file 型の要素にのみ適用されるプロパティ
accept
-
文字列で、サーバーが受け入れるファイル形式をカンマ区切りのリストで表すこの要素の
accept
属性を表します。 capture
-
文字列で、この要素の
capture
属性を表し、ファイルアップロードコントロール内でメディアキャプチャの入力方法を示します。 files
-
FileList
で、アップロードするために選択されたファイルのリストを表します。 webkitdirectory
-
論理型で、
webkitdirectory
属性を返します。true
の場合、ファイルシステム選択インターフェイスはファイルではなくディレクトリーのみが選択できるようになります。 webkitEntries
読取専用-
現在選択されているファイルまたはディレクトリーを示します。
テキストや数値を含む表示される要素にのみ適用されるプロパティ
autocomplete
-
文字列で、この要素の
autocomplete
属性を表します。これはコントロールの値をブラウザーで自動的に補完できるかどうかを示します。 max
-
文字列で、この要素の
max
属性を表します。この属性には、この項目の(数値または日時の)最大値が含まれ、最小値(min
属性)より小さくすることはできません。 maxLength
-
数値で、この要素の
maxlength
属性を表します。この属性には、値が持つことのできる(Unicode コードポイント単位の)最大文字数が含まれます。 min
-
文字列で、この要素の
min
属性を表します。この属性には、この項目の(数値または日時の)最小値が含まれ、最大値(max
属性)より大きくすることはできません。 minLength
-
数値で、この要素の
minlength
属性を表します。この属性には、値が持つことのできる(Unicode コードポイント単位の)最小文字数が含まれます。 pattern
-
文字列で、この要素の
pattern
属性を表します。ここにはコントロールの値をチェックするための正規表現を含みます。title
属性を使用してユーザーについてパターンを説明してください。この属性は、type
属性の値がtext
、search
、tel
、url
、email
の場合にのみ適用されます。 placeholder
-
文字列で、この要素の
placeholder
属性を表します。ここには、ユーザーがコントロールに何を入力できるかのヒントが設定されます。プレイスホルダーのテキストには、キャリッジリターンやラインフィードを含むことはできません。この属性は、type
属性の値がtext
、search
、tel
、url
、email
の場合にのみ適用されます。 readOnly
-
論理型で、この要素の
readonly
属性を表します。これは、ユーザーがコントロールの値を変更できないことを示します。この属性は、type
属性の値がhidden
、range
、color
、checkbox
、radio
、file
、ボタン型の場合は無視されます。 selectionDirection
-
文字列で、選択された方向を表します。可能な値は、
forward
(現在のロケールの文頭から文末の方向に選択)、backward
(逆方向)、none
(方向は不明)のいずれかです。。 selectionEnd
-
数値で、選択中のテキストの末尾の位置を表します。選択がない場合は、現在のテキスト入力カーソル位置の直後の文字のオフセットを返します。
selectionStart
-
数値で、選択中のテキストの先頭の位置を表します。何も選択していない場合は、その
<input>
要素内にあるテキスト入力カーソル (キャレット) の位置を返します。 size
-
数値で、この要素の
size
属性を表します。これはコントロールの外見の大きさが入ります。この値はtype
の値がtext
またはpassword
の場合は整数で文字数であり、それ以外の場合はピクセル単位です。type
がtext
、search
、tel
、url
、email
、password
のいずれかに設定されている場合のみ適用されます。
インスタンスメソッド
親インターフェイスである HTMLElement
から継承したメソッドもあります。
checkValidity()
-
論理値で、この要素が制約検証の対象であり、かつ制約を満たしていない場合に
false
を返します。この場合、この要素でinvalid
イベントも発生します。この要素が制約検証の対象でない場合、または制約を満たす場合はtrue
を返します。 reportValidity()
-
checkValidity()
メソッドを実行し、(入力が不正であったり pattern 属性がなかったりして) false が返された場合、フォームを送信した場合と同じように、入力が無効であることをユーザーに報告します。 select()
-
この input 要素のすべてのテキストを選択し、ユーザーがその内容をすべて置き換えることができるように、テキストにフォーカスを与えます。
setCustomValidity()
-
要素に独自の検証メッセージ設定します。このメッセージが空文字列ではない場合、その要素は独自の検証のエラーに見舞われており、検証に不合格になります。
setRangeText()
-
この input 要素のテキストの範囲を新しいテキストで置き換えます。
setSelectionRange()
-
入力要素のテキスト範囲を選択します(フォーカスは設定しません)。
showPicker()
-
日付、時刻、色、ファイルについて、ブラウザーのピッカーを表示します。
stepDown()
stepUp()
イベント
親インターフェイスである HTMLElement
から継承したイベントもあります。
以下のイベントは、 addEventListener()
を用いるか、このインターフェイスの onイベント名
プロパティにイベントリスナーを割り当てるかして待ち受けしてください。
仕様書
Specification |
---|
HTML Standard # htmlinputelement |
ブラウザーの互換性
BCD tables only load in the browser
関連情報
- このインターフェイスを実装している HTML 要素:
<input>