HTMLInputElement
HTMLInputElement インターフェイスは <input> 要素のオプション、レイアウト、表示方法を操作するための特別なプロパティやメソッドを提供します。
インスタンスプロパティ
一部のプロパティは、対応する属性を持つ入力要素の型にのみ適用されます。
align非推奨-
文字列: 要素の配置を表します。代わりに CSS を使用してください。
autocapitalizeExperimental-
文字列: ユーザー入力の大文字化の動作を定義します。有効な値は
none、off、characters、words、sentencesの何れかです。 defaultValue-
文字列: このオブジェクトが生成された際にもともと HTML で指定されていた既定値を取得/設定します。
dirName-
文字列: この要素の書字方向を取得/設定します。
inputmode-
この要素またはそのコンテンツを編集する際に使用する仮想キーボード設定の種類について、ブラウザーにヒントを提供します。
labels読取専用list読取専用-
HTMLElement:list属性が指す要素を返します。同じツリーに HTML 要素がない場合、プロパティはnullになることがあります。 multiple-
論理値: この要素の
multiple属性を返却/設定します。これは複数の値(例えば複数のファイル)を持つことが可能であるかどうかを示します。 name-
文字列: この要素の
name属性を返却/設定します。ここにはフォーム送信時にその要素を識別する名前が入ります。 popoverTargetActionExperimental-
<input>要素のtype="button"型で制御されるポップオーバー要素で実行されるアクション("hide"、"show"、"toggle"の何れか)を取得および設定します。これはpopovertargetactionという HTML 属性の値を反映します。 popoverTargetElementExperimental-
<input>要素のtype="button"型で制御されるポップオーバー要素を取得および設定します。これは JavaScript でpopovertargetという HTML 属性に相当するものです。 step-
文字列: この要素の
step属性を返却/設定します。これは、minやmaxと共に、数値や日時の値を設定する際の増分を制限します。文字列anyまたは正の浮動小数点数を設定することができます。anyが設定されていない場合、コントロールは最小値よりも大きい step 値の倍数のみを受け入れます。 type-
文字列: この要素の
type属性を返却/設定します。これは表示するコントロールの型を示します。利用可能な値については<input>のtype属性を参照してください。 useMap非推奨-
文字列: クライアント側イメージマップを表します。
value-
文字列: そのコントロールの現在の値を返却/設定します。ユーザーが予期しない値を入力した場合、これは空文字列を返すことがあります。
valueAsDate-
Date: 要素の値を日付として解釈して返却/設定します。変換できない場合はnullとなります。 valueAsNumber-
数値: この要素の値を、次のいずれかのうち一つとして解釈して返します。解釈は、時刻値、数値の順で行われ、変換できなければ
NaNとなります。
親フォームに関連するインスタンスプロパティ
form読取専用-
HTMLFormElement: 親の<form>要素の参照を返します。 formAction-
文字列: この要素の
formaction属性を返却/設定します。ここには要素によって送信された情報を処理するプログラムの URI が入ります。これは親フォームのaction属性を上書きします。 formEnctype-
文字列: この要素の
formenctype属性を返却/設定します。ここにはフォームをサーバーに送信する際のコンテンツの型が入ります。これは親フォームのenctype属性を上書きします。 formMethod-
文字列: この要素の
formmethod属性を返却/設定します。ここにはブラウザーがフォームを送信する際に用いる HTTP メソッドが入ります。これは親フォームのmethod属性を上書きします。 formNoValidate-
論理値: この要素の
formnovalidate属性を返却/設定します。これは送信時にそのフォームが検証されないかどうかを示します。これは親フォームのnovalidate属性を上書きします。 formTarget-
文字列: この要素の
formtarget属性を返却/設定します。ここにはフォームを送信した後で受け取ったレスポンスを表示する場所を示す名前またはキーワードが入ります。これは親フォームのtarget属性を上書きします。
hidden 以外の任意の型の入力要素に適用されるインスタンスプロパティ
autofocus-
論理値: この要素の
autofocus属性を返却/設定します。ページが読み込まれたときに、ユーザーが別のコントロールに入力するなどしてそれを上書きしない限り、そのフォームコントロールが入力フォーカスを持つべきであることを指定します。文書内の 1 つの form 要素だけがautofocus属性を持つことができます。 disabled-
論理値: この要素の
disabled属性を返却/設定します。これはそのコントロールが対話を受け付けないかどうかを示します。その入力値はフォームとともに送信されません。readonlyもご覧ください。 required-
論理値: この要素の
required属性を返却/設定します。これは、フォームを送信する前にユーザーが値を入力しなければならないかどうかを示します。 validationMessage読取専用-
文字列: そのコントロールが制約を満たさなかった場合、それを記述したローカライズされたメッセージを返します(もしあれば)。これは、コントロールが制約検証の候補ではない場合(
willValidateがfalseの場合)、または制約を満たしている場合は空の文字列です。この値は、setCustomValidity()メソッドで設定できます。 validity読取専用-
ValidityState: この要素の現在の検証状態を返します。 willValidate読取専用-
論理値: その要素が制約検証の候補であるかどうかを返します。これは何か制約検証を阻む条件がある場合、例えば、
typeがhidden、reset、buttonのいずれかである、祖先に<datalist>がある、disabledプロパティがtrueである、などです。
checkbox または radio 型の要素にのみ適用されるプロパティ
checked-
論理型: この要素の現在の状態を返却/設定します。
defaultChecked-
論理型: このオブジェクトを生成した HTML でもともと指定されていたラジオボタンまたはチェックボックスの既定の状態を返却/設定します。
indeterminate-
論理型: チェックボックスやラジオボタンの状態が不確定であるかどうかを返します。チェックボックスの場合は、その状態が不確定 (チェックでも未チェックでもない状態) であることを示すために、チェックボックスの外観が何らかの方法で不明瞭になったり、灰色になったりする効果があります。
checked属性の値には影響を与えず、チェックボックスをクリックするとその値は false になります。
image 型の要素にのみ適用されるプロパティ
file 型の要素にのみ適用されるプロパティ
accept-
文字列: サーバーが受け入れるファイル形式をカンマ区切りのリストで表すこの要素の
accept属性を返却/設定します。 allowdirsNon-standard-
論理型: 標準外の Directory Upload API の一部です。ファイルリストでディレクトリーとファイルの両方を選択できるようにするかどうかを示します。 Firefox でのみ実装されており、設定で隠されています。
fileswebkitdirectory-
論理型:
webkitdirectory属性を返します。trueの場合、ファイルシステム選択インターフェイスはファイルではなくディレクトリーのみが選択できるようになります。 webkitEntries-
FileSystemEntry(en-US) の配列: 現在選択されているファイルまたはディレクトリーを示します。
テキストや数値を含む表示される要素にのみ適用されるプロパティ
autocomplete-
文字列: この要素の
autocomplete属性を返却/設定します。これはコントロールの値をブラウザーで自動的に補完できるかどうかを示します。 max-
文字列: この要素の
max属性を返却/設定します。この属性には、この項目の(数値または日時の)最大値が含まれ、最小値(min属性)より小さくすることはできません。 maxLength-
unsigned long: この要素のmaxlength属性を返却/設定します。この属性には、値が持つことのできる(Unicode コードポイント単位の)最大文字数が含まれます。 min-
文字列: この要素の
min属性を返却/設定します。この属性には、この項目の(数値または日時の)最小値が含まれ、最大値(max属性)より大きくすることはできません。 minLength-
unsigned long: この要素の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、ボタン型の場合は無視されます。 selectionEnd-
unsigned long: 選択中のテキストの末尾の位置を返却/設定します。選択がない場合は、現在のテキスト入力カーソル位置の直後の文字のオフセットを返します。 selectionStart-
unsigned long: 選択中のテキストの先頭の位置を返却/設定します。何も選択していない場合は、その<input>要素内にあるテキスト入力カーソル (キャレット) の位置を返します。 selectionDirection-
文字列: 選択が行われた方向を返却/設定します。取りうる値は、
forward(現在のロケールにおける先頭から末尾の方向に選択された)、backward(逆方向)、none(方向が不明)です。 size-
unsigned long: この要素のsize属性を返却/設定します。これはコントロールの外見の大きさが入ります。この値はtypeの値がtextまたはpasswordの場合は整数で文字数であり、それ以外の場合はピクセル単位です。typeがtext、search、tel、url、email、passwordのいずれかに設定されている場合のみ適用されます。
インスタンスメソッド
blur()-
この input 要素からフォーカスを外します。キー入力はどこにも行かなくなります。
click()-
この input 要素のクリックをシミュレートします。
focus()-
この input 要素にフォーカスを与えます。キー入力がこの要素に行くようになります。
select()-
この input 要素のすべてのテキストを選択し、ユーザーがその内容をすべて置き換えることができるように、テキストにフォーカスを与えます。
setSelectionRange()-
この input 要素のテキストの範囲を選択します(ただし、フォーカスは与えません)。
setRangeText()-
この input 要素のテキストの範囲を新しいテキストで置き換えます。
setCustomValidity()-
要素に独自の検証メッセージ設定します。このメッセージが空の文字列ではない場合、その要素は独自の検証のエラーに見舞われており、検証に不合格になります。
showPicker()-
日付、時刻、色、ファイルについて、ブラウザーのピッカーを表示します。
checkValidity()-
論理値を返します。
falseの場合はその要素が制約検証の候補であり、かつ制約を満たしていないことを表します。この場合、この要素でinvalidイベントも発生します。trueの場合はその要素が制約検証の候補でないか、制約を満たしていることを表します。 reportValidity()-
checkValidity()メソッドを実行し、 false が返された場合 (無効な入力や pattern 属性が提供されていない場合) には、フォームを送信した場合と同様に、入力が無効であることをユーザーに報告します。 stepDown()-
valueを (step* n) だけ減少させます。 n が指定されなかった場合の既定値は 1 です。次の場合はInvalidStateError例外が発生します。 stepUp()-
valueを (step* n) だけ増加させます。 n が指定されなかった場合の既定値は 1 です。次の場合は INVALID_STATE_ERR 例外が発生します。
イベント
以下のイベントは、 addEventListener() を用いるか、このインターフェイスの onイベント名 プロパティにイベントリスナーを割り当てるかして待ち受けしてください。
input-
<input>、<select>、<textarea>のいずれかの要素のvalueが変更されたときに発生します。なお、このイベントは実際にはHTMLElementインターフェイス上で発生し、contenteditable要素にも適用されますが、フォーム入力要素で最も一般的に使用されるため、ここに挙げています。 invalid-
制約検証時に、要素が制約を満たしていなかった場合に発生します。
search-
<input>のtype="search"で検索が開始されたときに発生します。 selectionchangeイベント Experimental-
<input>の中のテキストの選択が変更された場合に発生します。
仕様書
| Specification |
|---|
| HTML Standard # htmlinputelement |
ブラウザーの互換性
BCD tables only load in the browser
関連情報
- このインターフェイスを実装している HTML 要素:
<input>