Javascript 将selectedIndex设置为下面的第一个选项和选项组

仅使用javaScript（无jQuery）如何将所选索引设置为选项组下面的第一个选项。填充时，每个组下面的选项数是可变的，但是在选项数组中，它们是按顺序编号的，因此很难确定一个组的结束位置和下一个组的开始位置。我有一个变量，它引用了我要使用的组选项id

<select id="selectBox">
  <optgroup id="optGrp1" label="Group 1">
  <optgroup id="optGrp2" label="Group 2">
    <option value="1585">option 1 in group 2</option>
    <option value="1589">option 2 in group 2</option>
  </optgroup>
  <optgroup id="optGrp3" label="Group 3">
  <optgroup id="optGrp4" label="Group 4">
</select>

第2组中的选项1
第2组中的选项2
克里斯托弗的第一个答案正是我所需要的。下面是代码的完整示例及其建议：

首先，在我的表单类中调用一个方法来填充列表框

//sample arrays
g.groups = {grpKey1:"label1", grpKey2:"label2"...}
g.options = {grpKey1:{optVal:"optTxt",optVal:"optTxt",...}, 
             grpKey2:{optVal:"optTxt",optVal:"optTxt",...},...}

//a reference to the select box and two arrays are passed to the method 
g.addGroupOptions(document.getElementById("mySelectBox"), g.groups, g.options); 

//this method in my form class populates the list box 
//with group labels and options under each label
this.addGroupOptions = function (selectBox, grpArray, optArray)
{
    for ( var grpKey in optArray )
    {
        var group = document.createElement('optgroup'),
            opt   = document.createElement('option');

        //retrive group label from groups array
        group.id    = grpKey;
        group.label = grpArray[grpKey];

        /*
        loop optArray[grpKey] get each subKey 
        */
        for ( var subKey in optArray[grpKey] )
        {
            opt.text   = optArray[grpKey][subKey];
            opt.value = subKey;
            group.appendChild(opt.cloneNode(true));
        }
    //append option group and subordinate options to list box
    selectBox.appendChild(group);
    }
}

然后应用Kristofer的建议将所选项目设置为所需选项组中的第一个选项

    document.getElementById(document.getElementById( myVariable ).value).getElementsByTagName('option')[0].selected = true;

欢迎来到堆栈溢出！请看一看，仔细阅读，特别是“…选项组下面的第一个选项…”当你说“下面”时，你真的是指“下面”吗？在你的问题中，只有一组人有任何选择。我在那里没有看到我的问题的具体参考？如果你能指出一个，那就太好了。为了让我的例子简单，我没有在其他组下面显示选项。提供了帮助您改进问题的链接。你没有向我们展示你为解决自己的问题所做的任何努力。请将您尝试的JavaScript添加到您的问题中。非常感谢，这正是我所需要的。您的第一个示例是完美答案文档。getElementById（'optGrp2'）。getElementsByTagName（'option'）[0]。selected=true；注意“office”这个词实际上是一个变量，因此应该用一个值为组id之一的变量来替换它，即：document.getElementById（myVariable.value）。这就是为什么选定项目的定位有效的原因。您不应该将自己的答案标记为已接受，而应该将为您提供正确解决方案的答案标记为已接受。
    document.getElementById(document.getElementById( myVariable ).value).getElementsByTagName('option')[0].selected = true;