下面的代码展示了使用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>

您可以使用querySelector。

E.g.

var myElement = document.getElementById('ddlViewBy');

var myValue = myElement.querySelector('[selected]').value;

您应该使用querySelector来实现这一点。这也规范了从表单元素获取值的方式。

var dropDownValue=document.querySelector（'#ddlViewBy'）.value；

小提琴：https://jsfiddle.net/3t80pubr/

另一种解决方案是：

document.getElementById('elementId').selectedOptions[0].value

初学者可能希望使用NAME属性而不是ID属性访问select中的值。我们知道所有表单元素都需要名称，甚至在获得id之前。

因此，我将添加getElementsByName（）解决方案，让新开发人员也能看到。

没有。表单元素的名称需要是唯一的，以便表单在发布后可以使用，但DOM可以允许多个元素共享名称。因此，如果可以，请考虑将ID添加到表单中，或者使用表单元素名称my_nth_select_named_x和my_nth_text_input_named_y显式添加ID。

使用getElementsByName的示例：

var e = document.getElementsByName("my_select_with_name_ddlViewBy")[0];
var strUser = e.options[e.selectedIndex].value;

在更现代的浏览器中，querySelector允许我们使用：checked伪类在一条语句中检索所选选项。从所选选项中，我们可以收集所需的任何信息：

const opt=document.querySelector（“#ddlViewBy选项：选中”）；//opt现在是选定的选项，因此console.log（opt.value，'是所选值'）；console.log（opt.text，“是所选选项的文本”）；<select id=“ddlViewBy”><option value=“1”>test1</option><option value=“2”selected=“selected”>test2</option><option value=“3”>test3</option></选择>