使用JS从列表中获取选定的项目[重复]

Posted 2023-05-07

【中文标题】使用JS从列表中获取选定的项目[重复]

【英文标题】：Get selected Item from the list with JS [duplicate]

【发布时间】：2011-01-18 19:29:20

【问题描述】：

我有一个加载了一些项目的 html 列表。我可以使用以下代码获取选择列表对象：

var list = document.getElementById('ddlReason');

但我需要帮助来确定如何检测从列表中选择了哪个值。

【参考方案1】：

// Gets your select
var list = document.getElementById('ddlReason');

// Get the index of selected item, first item 0, second item 1 etc ...
var INDEX = list.selectedIndex;

// Viola you're done
alert(list[INDEX].value);

编辑（忘记 .value）。

你也可以让它更简洁一些，但我想让它可读，这样你就可以看到发生了什么。较短的版本：

var list = document.getElementById('ddlReason');
alert(list[list.selectedIndex].value);

【讨论】：

很确定应该是 list.options[INDEX].value

在所有浏览器中？我可能要学点东西了。

【参考方案2】：

其实你可以这样做

var list = document.getElementById('ddlReason').value;

如果您向list 发出警报，您将获得选择标签的值。

【参考方案3】：

列表对象将有一个 'options' 属性，它是列表中所有选项的数组，还有一个 'selectedIndex' 属性，其中包含所选项目的索引（如果有多个，则为第一个所选项目）。所以你可以这样做：

var list = document.getElementById('ddlReason');
var selectedValue = list.options[list.selectedIndex];