HTMLSelectElement

このインターフェイスは HTMLElement、Element、Node からプロパティを継承しています。

HTMLSelectElement.autofocus

論理値で、 HTML の autofocus 属性を反映し、ページが読み込みの際に、ユーザーが異なるコントロールに入力するなどで上書きをしない限り、コントロールが入力フォーカスを持つべきかどうかを示します。文書中のフォーム関連要素の中で、この属性を指定できるのは 1 つだけです。

HTMLSelectElement.disabled

論理値で、 HTML の disabled 属性を反映し、コントロールが無効か否か、つまりクリックを受け付けるかどうかを示します。

HTMLSelectElement.form読取専用

HTMLFormElement で、この要素が関連付けられているフォームを反映します。この要素が <form> 要素に関連付けられていなければ、 null を返します。

HTMLSelectElement.labels読取専用

NodeList で、この要素に関連付けられた <label> 要素を表します。

HTMLSelectElement.length

unsigned long で、 <option> 要素がこの select 要素に含まれる数です。

HTMLSelectElement.multiple

論理値で、 HTML の multiple 要素を反映し、複数の項目を選択することができるかどうかを示します。

HTMLSelectElement.name

DOMString で、 HTML の name 属性を反映し、サーバーおよび DOM 検索機能で使用されるこのコントロールの名前が入ります。

HTMLSelectElement.options読取専用

HTMLOptionsCollection で、この要素に含まれる一連の <option> 要素を表します。

HTMLSelectElement.required

論理値で、 HTML の required 属性を反映し、ユーザーがフォームを送信する前に値を選択する必要があることを示します。

HTMLSelectElement.selectedIndex

long で、最初に選択された <option> 要素の序数を反映します。 -1 の値は要素が選択されていないことを示します。

HTMLSelectElement.selectedOptions読取専用

HTMLCollection で、選択されているすべての <option> 要素を反映します。

HTMLSelectElement.size

long で、 HTML の size 属性を反映し、コントロール内で見える項目の数が入ります。既定値は、 multiple が true でなければ 1 で、そうでなければ 4 です。

HTMLSelectElement.type読取専用

DOMString で、フォームコントロールの型を表します。 multiple が true である場合は "select-multiple" を返し、そうでなければ "select-one" を返します。

HTMLSelectElement.validationMessage読取専用

DOMString で、 もしあれば) 制約検証でコントロールが合格しなかった場合のローカライズされたメッセージを表現します。この属性はコントロールが制約検証の対象にならない場合 (willValidate が false の場合) や、制約を満たしている場合は空文字列になります。

HTMLSelectElement.validity読取専用

ValidityState で、このボタンがある妥当性の状態を表します。

HTMLSelectElement.value

DOMString で、このフォームコントロールの値を反映します。選択されている option 要素があれば最初のものの value プロパティを返し、そうでなければ空文字列を返します。

HTMLSelectElement.willValidate読取専用

論理値で、ボタンが制約検証の候補になるかどうかを示します。制約検証が阻止される場合は false となります。

このインターフェイスは HTMLElement、Element、Node からメソッドを継承しています。

HTMLSelectElement.add()

要素をこの select 要素にある option 要素の集合に加えます。

HTMLSelectElement.blur() 非推奨

この要素から入力フォーカスを外します。このメソッドは HTMLElement での実装になりました。

HTMLSelectElement.checkValidity()

要素に何らかの制約があるか、それを満たしているかをチェックします。要素が制約に違反していた場合、ブラウザーはキャンセル可能な invalid イベントを要素に送ります (そして false を返します)。

HTMLSelectElement.focus() 非推奨

この要素に入力フォーカスを与えます。このメソッドは HTMLElement での実装になりました。

HTMLSelectElement.item()

この <select> 要素の選択肢の集合から項目を取得します。配列風に角括弧または括弧で序数を指定することで、明示的にこのメソッドを呼び出さずに項目にアクセスすることもできます。

HTMLSelectElement.namedItem()

選択肢の集合から指定した名前で項目を取得します。名前の文字列は option ノードの id または name 属性と一致させることができます。配列風に角括弧または括弧で名前を指定することで、明示的にこのメソッドを呼び出さずに項目にアクセスすることもできます。

HTMLSelectElement.remove()

この select 要素の選択肢の集合から、指定された序数の要素を削除します。

HTMLSelectElement.reportValidity()

このメソッドは、この要素の制約の問題があれば、ユーザーに報告します。問題があれば、キャンセル可能な invalid イベントを要素で発生させ、 false を返します。問題がなければ、 true を返します。

HTMLSelectElement.setCustomValidity()

選択要素の独自の検証メッセージを指定されたメッセージに設定します。空文字列を使用すると、要素に独自の検証エラーがないことを示します。

これらのイベントを待ち受けするには addEventListener() を使用するか、イベントリスナーをこのインターフェイスの onイベント名 プロパティに代入するかしてください。

change イベント

<input>, <select>, <textarea> の各要素で、ユーザーが要素の値の変更を確定したときに発行されます。

input イベント

<input>, <select>, <textarea> の各要素の value が変化したときに発行されます。

/* 以下の HTML があると仮定します
<select id='s'>
    <option>First</option>
    <option selected>Second</option>
    <option>Third</option>
</select>
*/

var select = document.getElementById('s');

// 選択された選択肢の序数を返す
console.log(select.selectedIndex); // 1

// 選択された選択肢の値を返す
console.log(select.options[select.selectedIndex].value) // Second

ユーザーの選択の変更を追跡するのであれば、 change イベントが <select> に発生するのを監視するほうがより良い方法です。これは値が変化したときに通知され、必要なものを更新することができます。詳しくは、 change イベントのドキュメントで提供されている例を参照してください。

• このインターフェイスを実装している HTML 要素: <select>