動態添加值后，在選擇框中選擇一個值

Question

在輸入到文本框中並單擊添加按鈕的值后，如何在選擇框中（下拉列表）選擇新添加的值？

<html>
  <head>
    <script>
      function addref(value) {
        var x = document.getElementById("thebox");
        var option = document.createElement("option");
        option.text = value
        x.add(option,x.options[null])
      }
    </script>
  </head>
  <body>
    <form>
      <select id="thebox">
      </select>
    </form>
    <br>
    <input type="text" id="theinput"/>
    <input type="button" value="Add" name="B1" onclick="addref(document.getElementById('theinput').value)"/>
  </body>
</html>

Answer 1

嘗試這個：

x.selectedIndex = x.options.length - 1;

之后，您可以使用

var val = x.value;

要么

var val = x[x.selectedIndex].value;

在MDN中<select> 。

另外，代替x.add(option,x.options[null])而只需使用x.add(option) 。 這將在option末尾添加新創建的options 。 第二個參數應為整數，它表示要在其中添加新選項的索引位置。

Answer 2

要獲得選定的值，請使用以下命令：

var e = document.getElementById("thebox");
var theValue = e.options[e.selectedIndex].value;

要獲取所選文本，請使用以下命令：

var e = document.getElementById("thebox");
var theText = e.options[e.selectedIndex].text;

是否動態添加無關緊要。

動態添加值后，在選擇框中選擇一個值

問題描述

2 個解決方案

解決方案1
0 已采納 2013-01-25 17:08:12

解決方案2
0 2013-01-25 17:15:21

動態添加值后，在選擇框中選擇一個值

問題描述

2 個解決方案

解決方案1 0 已采納 2013-01-25 17:08:12

解決方案2 0 2013-01-25 17:15:21

解決方案1
0 已采納 2013-01-25 17:08:12

解決方案2
0 2013-01-25 17:15:21