Javascript 如何更改选择显示的文本？

我有一系列的选择框，其内容是动态定义的，第二个框的选项根据第一个选择填充，依此类推。我遇到的问题是，一旦（例如）为前两个选择框选择了选项，然后想再次开始更改第一个选择，尽管我重置了选项，第二个框的显示文本仍保持原样。如果我下拉第二个选择框，则会显示正确的（更新的）选项。下面的示例-您可以看到，在任何更改事件中，我尝试将子选择框的选项0设置为等于“-”，以覆盖历史上选择的文本，但这似乎不起作用

重置选项后，如何以编程方式更新显示的选择文本

   <form name="capacity">
<table>
<tr><td>Type:</td>
  <td><select onchange="onchange1();" id="type">
  <option value="-">-</option>
  <option value="Casing">Casing</option>
  <option value="Tubing">Tubing</option>
  </select></td></tr>

<tr><td>OD:</td>
    <td><select onchange="onchange2()" id="od">
    <option value="-">-</option>
    </select></td></tr>

<tr><td>Weight:</td>
  <td><select id="ppf">
    <option value="-">-</option>
      </select></td></tr></table>

---

要设置选项，请使用以下方法：

// by index
my_select = document.getElementById("my_select_box");
my_select.selectedIndex = 0; // set first option

// by value
var value = "my_option";
for (var i = 0; i < my_select.options.length; i += 1) {
    if (my_select.options[i].value === value) {
        my_select.selectedIndex = i;
    }
}

//按索引
my_select=document.getElementById（“my_select_框”）；
my_select.selectedIndex=0；//设置第一选项
//按价值
var value=“我的期权”；
对于（变量i=0；i

你能发布一个完整的演示来重现你的问题吗，在，或者类似的问题吗？和站点：它实际上似乎在JSFIDLE中起作用-我会解释为什么它在我的情况下不起作用。不知道这是否与JQuery Mobile有关？我完全希望这是答案，但在实现时发现它实际上并没有为我重置显示选择。我会看看是否可以在JSFiddle上设置一个演示，它实际上似乎在JSFiddle中工作——我会弄清楚为什么在我的例子中它不工作。不知道这是否与JQuery Mobile有关？

// by index
my_select = document.getElementById("my_select_box");
my_select.selectedIndex = 0; // set first option

// by value
var value = "my_option";
for (var i = 0; i < my_select.options.length; i += 1) {
    if (my_select.options[i].value === value) {
        my_select.selectedIndex = i;
    }
}