Question

我尝试通过选择下拉菜单更改元素 - 但是，我无法动态更改元素。

<select id="optMapList">
        <option>Map 1</option>
        <option>Map 2</option>
</select>
<script>
document.getElementById("maptype").innerHTML=optMapList.options[optMapList.selectedIndex].text
</script>

Answer 1

您的代码似乎运行良好。我想你错过了一个事实，你必须听一个'change'事件，以便能够在变化上运行代码。这样做如下：

var optMapList = document.getElementById('optMapList');

optMapList.onchange = function() {
        document.getElementById("maptype").innerHTML = optMapList.options[optMapList.selectedIndex].text;
}

工作示例：http://jsfiddle.net/thijs_s/gx9mf1ct/

Answer 2

您可以在事件监听器中使用选择列表的value属性，如下所示。

var optMapList = document.getElementById('optMapList');

optMapList.onchange = function() {
    document.getElementById("maptype").innerHTML = optMapList.value;}

如何使用选择下拉菜单更改元素

2 个答案: