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

Question

以下代码用HTML数据填充第二个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(); 

小提琴：http://jsfiddle.net/e9zxY/