javascript - jQuery - 将多个选择的下拉值存储在数组中

Question

以下代码使用 HTML 数据填充第二个 select 语句。我面临的问题是，我克隆了两个 select 语句，并在提交表单时，我想将两个 select 中的所有选定选项值保存到 Array() 中。

迭代所有下拉值的最佳方式是什么(主题和类别最多可以添加 5 个)？

提前致谢。

$(".SubjectCategory").live("click", function () {
    var $this = $(this);
    var $elem = $this.closest('div').nextAll('div').first().find('select');
    var a = $this.val();

    $.get("/userControls/BookSubjectHandler.ashx?category=" + a, {}, function (data) {
        $elem.html(data);
    });
});

<div class="singleField subjectField">
  <label id="Category" class="fieldSml">Subject Matter</label>
  <div class="bookDetails ddl"><select id="ddlSubjectMatter" class="fieldSml SubjectCategory"></select></div>

  <label id="Subjects" class="fieldSml">Category</label> 
  <div class="bookDetails ddl" id="subjectMatter"><select id="ddlSubjects" class="fieldSml Subjects"></select></div>
</div>

Answer 1

使用 jQuery .map 函数，您可以一次检索所有值:

var arrayOfValues = $(".bookDetails.ddl select").map(function (i, el) { return $(el).val(); }).get();

fiddle :http://jsfiddle.net/e9zxY/