如何动态获取选择标记的值

How to get dynamically a value of a select tag?

本文关键字：选择 获取 何动态 动态      更新时间：2023-09-26

我想在我的表单中动态地获得一个选择标签的值。我实际上是这么做的

<select name="media_types_id" id="type">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>
<script>
    var option = $("#type option:selected").val();
    console.log(option);
</script>

，但这返回所选选项的值，它不会改变，当我改变我的表单中的选项。我选择1，如果我选择2之后它的值保持在1…

将change事件绑定到<select>元素并使用其值:

$("#type").on("change", function() {
    var option = this.value;
    console.log(option);
});

还要注意，事件绑定应该在DOM加载时完成，所以要么将此代码放在</body>之前，要么使用$(function() { });处理程序。

尝试以下使用change()事件来获取下拉列表的选定值

$("#type").on("change",function(){
        var Option = this.val();
        console.log(Option);
});

但是你的代码是全局运行的。所以第一次，当页面加载1是选择的值。

尝试在change事件

中编写代码

。

$('#type').on("change",function(){
    var option = $("option:selected",this).val();
    console.log(option);
});

您需要将更改事件绑定到选择列表:

<script>
  $(function() {
     $("#type").change(function() {
     console.log($(this).val());
    });
 });
</script>

使用事件处理程序

事件处理程序在每次发生事件时调用一个函数。

纯JS 

var option = document.getElementById("type").value;
document.getElementById("type").onchange = function(e) {
    option = this.value;
}

示例:http://jsfiddle.net/howderek/FnT9T/3/

相关文章：