jquery - 如何使用动态ID获取多选选项值？

Question

我的页面中几乎没有多选下拉列表。因此，我需要使用 id 获取该多选选项的值。这里将动态生成特定元素的 id。

然后我将循环遍历一个数组

var value = $('#' + arrayObj[i]+'option:selected').val();

我无法获取所选选项值。相反，它显示未定义

Answer 1

以下是实现这一目标的方法。希望对您有所帮助。

const selectList = [
  {id: 'list1', options: ['a', 'b', 'c']}
];
selectList.map(select => {
  let list = '<select id="' + select.id + '" multiple></select>';
  $('#lists-container').append(list);
  select.options.map(option => {
    $('#' + select.id).append('<option>' + option + '</option>');
  });
  
  $('#' + select.id).on('change', evt => {
     let result = '';
     $(evt.target).children('option:selected' ).each(function() {
      result += $( this ).text();
    });
    $("#results").text(result);
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div id="lists-container"></div>
<div id="results"></div>