Question

我有一个select字段数组，想要使用jQuery获取所选选项的值。

选择字段就像

<select name="a[]" onchange="getValue(this)">
  <option value="11">11</option>
  <option value="12">12</option>
</select>
<select name="a[]" onchange="getValue(this)">
  <option value="21">21</option>
  <option value="22">22</option>
</select>

我的javascript代码是

function getValue(ele) {
  alert(ele.val());
}

但它没有用。

Answer 1

<select name="a[]">
  <option value="11">11</option>
  <option value="12">12</option>
</select>
<select name="a[]">
  <option value="21">21</option>
  <option value="22">22</option>
</select>

的javascript

$("select").on("change", function (event){
   alert($(this).val());
})

如果您不想选择所有选择输入列表，那么您也可以这样做

$("select[name='a\[\]']").on("change", function (event){
       alert($(this).val());
    })

这只会选择名称为a []

的选择列表

Answer 2

试试这个：

$(document).ready(function(){

    $("select").on("change",function(){

        alert($(this).val());


    })
})

最终代码：

<!DOCTYPE html>
<html lang="en">
<head>
</head>
    
    <body>
        
        <select name="a[]">
          <option value="11">11</option>
          <option value="12">12</option>
        </select>
        <select name="a[]">
          <option value="21">21</option>
          <option value="22">22</option>
        </select>
        
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
        <script>
            
        $(document).ready(function(){

            $("select").on("change",function(){

                alert($(this).val());


            })
        })
    </script>
    </body>
</html>

Answer 3

val() 是一个jQuery方法，不能与DOM对象一起使用。要获取值，请使用元素的value属性。

function getValue(ele) {
  alert(ele.value);
  // with jQuery it should be
  // alert($(ele).val());
}

function getValue(ele) {
  alert(ele.value);
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name="a[]" onchange="getValue(this)">
  <option value="11">11</option>
  <option value="12">12</option>
</select>
<select name="a[]" onchange="getValue(this)">
  <option value="21">21</option>
  <option value="22">22</option>
</select>

由于您在问题中标记了jQuery，请使用 change() 事件处理程序，更改事件内部回调this引用相应的dom对象。

// select element with the name  attribute equals 
// selector can be used and then bind event handler
$('[name="a[]"]').change(function() {
  // get the value
  alert(this.value)
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name="a[]">
  <option value="11">11</option>
  <option value="12">12</option>
</select>
<select name="a[]">
  <option value="21">21</option>
  <option value="22">22</option>
</select>

使用jQuery获取所选选项的值

3 个答案: