HTMLSelectElement: value 属性

Baseline 已广泛支持

此特性已相当成熟,可在许多设备和浏览器版本上使用。自 ⁨2015 年 7 月⁩以来,各浏览器均已提供此特性。

HTMLSelectElement.value 属性包含与该 <select> 元素相关联的第一个选定 <option> 元素的值。

此属性也可以直接设置,例如根据某个条件设置默认值。

一个字符串,包含此 <select> 元素中第一个选定 <option> 元素的值,如果没有选定选项,则为空字符串。

示例

检索选定的值

html
<label for="bird-select">Choose a bird:</label>

<select name="birds" id="bird-select">
  <option value="">--Please choose an option--</option>
  <option value="Scarlet ibis">Scarlet ibis</option>
  <option value="Marabou stork">Marabou stork</option>
  <option value="Roseate spoonbill">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(`Selection: ${select.value}`);
});

规范

规范
HTML
# dom-select-value-dev

浏览器兼容性

另见

  • 实现此接口的 <select> HTML 元素。