Question

我想动态获取表单中select标签的值。我实际上是这样做的

<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 ...

Answer 1

将change个事件绑定到您的<select>元素并使用其值：

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

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

Answer 2

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

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

});

Answer 3

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

在change事件

中尝试您的代码

即

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

Answer 4

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

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

Answer 5

使用事件处理程序。

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

纯JS

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

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

如何动态获取select标签的值？

5 个答案:

使用事件处理程序。