使用JavaScript在下拉列表中获取选定的值

如何使用JavaScript从下拉列表中获取选定的值？

我尝试了下面的方法，但是它们都返回选择的索引而不是值：

var as = document.form1.ddlViewBy.value;
var e = document.getElementById("ddlViewBy");
var strUser = e.options[e.selectedIndex].value;

---

#1楼

如果您具有如下所示的select元素：

<select id="ddlViewBy">
  <option value="1">test1</option>
  <option value="2" selected="selected">test2</option>
  <option value="3">test3</option>
</select>

运行此代码：

var e = document.getElementById("ddlViewBy");
var strUser = e.options[e.selectedIndex].value;

将strUser设为2 。 如果您真正想要的是test2 ，请执行以下操作：

var e = document.getElementById("ddlViewBy");
var strUser = e.options[e.selectedIndex].text;

这会使strUser成为test2

---

#2楼

var strUser = e.options[e.selectedIndex].value;

这是正确的，应该会给您带来价值。 是您要的文字吗？

var strUser = e.options[e.selectedIndex].text;

所以您在术语上很清楚：

<select>
    <option value="hello">Hello World</option>
</select>

该选项具有：

• 索引= 0
• 值=你好
• 文字= Hello World

---

#3楼

我能看到的使该代码不起作用的唯一原因是，如果您使用的是IE7-，并且忘记为<option> -tags指定value属性，则其他所有浏览器都应将open-close标记中的内容转换为期权价值。

---

#4楼

如果您曾经运行过纯粹为Internet Explorer编写的代码，则可能会看到以下内容：

var e = document.getElementById("ddlViewBy");
var strUser = e.options(e.selectedIndex).value;

在Firefox等中运行上述命令将给您一个“不是函数”错误，因为Internet Explorer允许您摆脱使用（）而不是[]的麻烦：

var e = document.getElementById("ddlViewBy");
var strUser = e.options[e.selectedIndex].value;

正确的方法是使用方括号。

---

#5楼

以下代码展示了与使用JavaScript从输入/选择字段获取/输入值有关的各种示例。

源链接

工作的