HTMLSelectElement: value プロパティ
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.
HTMLSelectElement.value
プロパティは、この <select>
要素に関連付けられた <option>
要素のうち、選択された最初のものの値を格納します。
このプロパティは直接設定することもでき、例えば、何らかの条件に基づいて既定値を設定するには、次のようにします。
値
例
選択された値の取得
html
<label for="bird-select">鳥を選択してください:</label>
<select name="birds" id="bird-select">
<option value="">--オプションを選択してください--</option>
<option value="Scarlet ibis">ショウジョウトキ</option>
<option value="Marabou stork">マラボウコウノトリ</option>
<option value="Roseate spoonbill">ベニヘラサギ</option>
</select>
<pre id="log"></pre>
js
const logElement = document.querySelector("#log");
function log(text) {
logElement.innerText = text;
}
const select = document.querySelector("#bird-select");
select.addEventListener("change", () => {
log(`選択: ${select.value}`);
});
仕様書
Specification |
---|
HTML Standard # dom-select-value-dev |
ブラウザーの互換性
BCD tables only load in the browser
関連情報
- このインターフェイスを実装している HTML の
<select>
要素。