Question

我想做类似的事情，但我无法通过这种方式更改selectedIndex值：

var selected = document.getElementById("state-select");



switch (state) {
                    case 'VA':
                        selected.options[selected.selectedIndex] = 0;
                        break;
                    case 'NC':
                        selected.options[selected.selectedIndex] = 1;
                        break;
                    case 'SC':
                        selected.options[selected.selectedIndex] = 2;
                        break;                       

}

Answer 1

switch语句很酷，但使用哈希来完成工作可以更加灵活。如下所示，您可以检查状态是否在哈希中，如果是，请使用它。

var selected = document.getElementById("state-select"),
    states = { 'VA' : 0,
               'NC' : 1,
               'SC' : 2
             };
// if `state` ( not sure what it is ) is in the hash
if ( states[ state ] !== undefined ) { 
   //select option based on the hash
   selected.selectedIndex = states[ state ];
}

如果你需要选择/ assign-the-select by值，你可以遍历这些值，或者使用qSA或像jQuery或dojo这样的库来获取它。

<select id="state-select">
  <option value="1">NC</option>
  <option value="2">SC</option>
</select>

使用jQuery

// select SC
$( '#state-select' ).val( 2 );

<强>迭代

var sel = document.getElementById( 'state-select' ),
    opts = sel.options;

// loop through the options, check the values
for ( var i = 0; i < opts.length; i++ ) {
    // assuming 2 would be states[ state ] or whatevs
    if ( opts[i] == 2 ) {
      // set to this index
      sel.selectedIndex = i;
      // stop iterating
      break;
    }
}

Answer 2

为此，您无需对options执行任何操作，您可以通过直接设置select元素的.selectedIndex属性来更改所选元素：

...
case 'VA':
   selected.selectedIndex = 0;
   break;
// etc.

（假设这是一个单选select元素。）

我相信如果你将selectedIndex设置为-1，它将不会选择任何选项。

Answer 3

或者selected.value = [选项值]

Answer 4

尝试：

selected.selectedIndex = [Your index]

如何使用getElementById更改select元素的selectedIndex

4 个答案: