如何使用JavaScript从下拉列表中获取所选值?

<表单><select id=“ddlViewBy”><option value=“1”>test1</option><option value=“2”selected=“selected”>test2</option><option value=“3”>test3</option></选择></form>


当前回答

以下是JavaScript代码行:

var x = document.form1.list.value;

假设下拉菜单名为list name=“list”,并包含在name属性name=“form1”的表单中。

其他回答

给定如下所示的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 value = e.value;
var text = e.options[e.selectedIndex].text;

结果如下:

value == 2
text == "test2"

交互示例:

var e=document.getElementById(“ddlViewBy”);函数onChange(){var值=e.value;var text=e.options[e.selectedIndex].text;console.log(值,文本);}e.onchange=onchange;onChange();<表单><select id=“ddlViewBy”><option value=“1”>test1</option><option value=“2”selected=“selected”>test2</option><option value=“3”>test3</option></选择></form>

我认为您可以将事件侦听器附加到select标记本身,例如:

<script>
  document.addEventListener("DOMContentLoaded", (_) => {
    document.querySelector("select").addEventListener("change", (e) => {
      console.log(e.target.value);
    });
  });
</script>

在这种情况下,您应该确保所有选项都有一个value属性,并且它们不为空。

Try

ddlViewBy.value                      // value

ddlViewBy.selectedOptions[0].text    // label

console.log(ddlViewBy.value);console.log(ddlViewBy.selectedOptions[0].text);<select id=“ddlViewBy”><option value=“1”>快乐</option><option value=“2”>树</option><option value=“3”selected=“selected”>朋友</option></选择>

下面的代码展示了使用JavaScript从输入/选择字段获取/放置值的各种示例。

源链接

使用Javascript和jQuery演示

 <select id="Ultra" onchange="run()">  <!--Call run() function-->
     <option value="0">Select</option>
     <option value="8">text1</option>
     <option value="5">text2</option>
     <option value="4">text3</option>
</select><br><br>
TextBox1<br>
<input type="text" id="srt" placeholder="get value on option select"><br>
TextBox2<br>
<input type="text" id="rtt"  placeholder="Write Something !" onkeyup="up()">

以下脚本获取所选选项的值并将其放入文本框1

<script>
    function run() {
        document.getElementById("srt").value = document.getElementById("Ultra").value;
    }
</script>

下面的脚本从文本框2中获取一个值,并用其值发出警报

<script>
    function up() {
        //if (document.getElementById("srt").value != "") {
            var dop = document.getElementById("srt").value;
        //}
        alert(dop);
    }
</script>

以下脚本正在从函数调用函数

<script>
    function up() {
        var dop = document.getElementById("srt").value;
        pop(dop); // Calling function pop
    }

    function pop(val) {
        alert(val);
    }?
</script>

只需执行:document.getElementById('dselect').options.selectedIndex

然后,您将获得从0开始的select索引值。