Option() | Web API

在此页

句法
范例
规范
相关话题

Option() 构造函数创建新 HTMLOptionElement .

句法

var optionElementReference = new Option(text, value, defaultSelected, selected);

参数

text 可选: A DOMString representing the content of the element, i.e. the displayed text. If this is not specified, a default value of "" (empty string) is used.
value 可选: A DOMString representing the value of the HTMLOptionElement , i.e. the value attribute of the equivalent <option> . If this is not specified, the value of text is used as the value, e.g. for the associated <select> element's value when the form is submitted to the server.
defaultSelected 可选: A 布尔 that sets the selected attribute value, i.e. so that this <option> will be the default value selected in the <select> element when the page is first loaded. If this is not specified, a default value of false is used. Note that a value of true does not set the option to selected if it is not already selected.
selected 可选: A 布尔 that sets the option's selected state; the default is false (not selected). If omitted, even if the defaultSelected argument is true, the option is not selected.

范例

Just add new options

 /* assuming we have the following HTML
<select id='s'>
</select>
*/
var s = document.getElementById('s');
var options = [Four, Five, Six];
options.forEach(function(element,key) {
    s[key] = new Option(element,key);
});

Append options with different parameters

/* assuming we have the following HTML
<select id="s">
    <option>First</option>
    <option>Second</option>
    <option>Third</option>
</select>
*/
var s = document.getElementById('s');
var options = [ 'zero', 'one', 'two' ];
options.forEach(function(element, key) {
  if (element == 'zero') {
    s[s.options.length] = new Option(element, s.options.length, false, false);
  }
  if (element == 'one') {
    s[s.options.length] = new Option(element, s.options.length, true, false); // Will add the "selected" attribute
  }
  if (element == 'two') {
    s[s.options.length] = new Option(element, s.options.length, false, true); // Just will be selected in "view"
  }
});
/* Result
<select id="s">
  <option value="0">zero</option>
  <option value="1" selected="">one</option>
  <option value="2">two</option> // User will see this as 'selected'
</select>
*/

规范

规范	状态	注释
HTML5 在该规范中的 Option 定义。	推荐

元数据

最后修改： Mar 18, 2019

在此页

句法

参数

范例

Just add new options

Append options with different parameters

规范

相关话题