使用dom将选择标记选项更改为默认值?

时间:2014-02-15 22:43:53

标签: javascript html dom select tags

我有以下代码,我正在尝试更改两个选择输入的默认值,我希望第一个对话的 false hello 第二次对话,但有些事情是不对的。

这是代码中应该进行更改的行

var vSelect = document.getElementById('select_1');
    vSelect.options[0].defaultSelected = 1; 

    vSelect = document.getElementById('select_2');
    vSelect.options[1].defaultSelected = 0; 

options[index]用于表示每个select标记中的状态,还是页面中所有option标记的全局索引?

我真正想做的是在不知道选项索引的情况下将特定的select标记设置为默认选项,让我知道为什么在这种情况下不可能。

<html>
<head>  
</head>
<body onload = "default_settings()">
<style type = "text/css">
body
{
    background-color: white;
}
#select_1, #menu_select_label_id_1, #select_2, #menu_select_label_id_2
{  
    color:#64FFFF; 
    font-size:14px;         
    background: rgba(0,0,0,1.0);    
    text-align: left;
    max-width:90px;
    padding: 4px 4px;
}
</style>
<script language="JavaScript">
function default_settings() 
{           
    var vSelect = document.getElementById('select_1');
    vSelect.options[0].defaultSelected = 1; 

    vSelect = document.getElementById('select_2');
    vSelect.options[1].defaultSelected = 0; 
}
</script>
<select  id = "select_1">
    <option value = "0">true</option>
    <option  value = "1">false</option>
</select>
<label id = "menu_select_label_id_1" for = "select_1">
    boolean 
</label>
<br>
<select  id = "select_2">
    <option value = "0">hello</option>
    <option  value = "1">goodbye</option>
</select>
<label id = "menu_select_label_id_2" for = "select2">
    greeting
</label>
</body>
</html>

1 个答案:

答案 0 :(得分:1)

defaultSelectedoption元素的布尔属性,指示 选项是否为select的默认选项。

因此,您只需将其设置为您想要作为默认值的选项,并且只将其设置为真值(将被强制转换为true)。它不是一个索引,它不是一个值。

  

options[index]是用于表示每个选择标记中的状态还是它们是页面中所有选项标记的全局索引?

它们是特定option元素中的select个元素(对象)。

  

我真正想做的是在不知道选项索引的情况下将特定的选择标记设置为默认选项,让我知道为什么在这种情况下不可能。

要做到这一点,你必须知道某事有关该选项(其值,文本),然后搜索找到匹配选项的选项,并将其defaultSelected设置为{ {1}}。

例如:我们在这里找到值为true的选项并将其设为默认选项:

"foo"

Live Copy | Source