Question

我有两个选择这样的盒子：

<div class="info">
    <select name="type" class="data" onchange="getData(this.value);">
        <option value="teacher">Teacher</option>
        <option value="student">Student</option>
    </select>
    <select name="class" class="data" onchange="getData(this.value);">
        <option value="1A">Class 1A</option>
        <option value="1B">Class 1B</option>
    </select>
</div>
<script>
    function getData() {
        var datas = [];
        $.each($('.data'), function (index, value) {
            if ($(value).prop('selected') == true) {
                datas.push($(value).val());
            }
        });
        console.log(datas);
    }
</script>

我希望在调用onchange事件时将所有选定的值存储在数组中。但是我的代码没有用，有什么帮助吗？

Answer 1

要使用jQuery实现此目的，您可以删除过时的onchange属性，并使用不引人注目的JS代码来挂钩您的事件。

从那里，您可以使用map()根据所有.data元素的选定值构建数组。试试这个：

＆＃13;

$('.data').change(function() {
  var selectedValues = $('.data').map(function() {
    return $(this).val();
  }).get();

  console.log(selectedValues);
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="info">
  <select name="type" class="data">
    <option value="teacher">Teacher</option>
    <option value="student">Student</option>
  </select>
  <select name="class" class="data">
    <option value="1A">Class 1A</option>
    <option value="1B">Class 1B</option>
  </select>
</div>

＆＃13;

Answer 2

您需要在each上使用.data从下拉列表中获取所有选定的值。检查以下代码。

＆＃13;

$(".data").on("change", function () {
  var datas = [];
    $(".data").each(function () {
        datas.push($(this).val());
    })
    console.log(datas);
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="info">
    <select name="type" class="data" >
        <option value="teacher">Teacher</option>
        <option value="student">Student</option>
    </select>
    <select name="class" class="data">
        <option value="1A">Class 1A</option>
        <option value="1B">Class 1B</option>
    </select>
</div>

＆＃13;

如何将2个选择框中的所有选定值存储到Jquery的数组中？

2 个答案: