使用 jquery 选择器从表单中获取值，多个选择字段

Question

首先，我很难制定我的头衔，所以我很抱歉。 无论如何，我的问题。

我有一个大信息表，其中一些单元格有表单域，特别是每行有两个表单域。在该行的末尾，我有一个“保存”链接。

有多行，每行都有自己的字段集。

我很难将这两个值存储在一个变量中，因为它们是动态呈现的，我没有连接到每个特定的 id。

因此，我认为向上遍历 DOM 会产生我的结果，但不，到目前为止，我只是得到“未定义”（我认为我走在正确的道路上，我只是想不通）。

以这段代码为例；

<td>
<select multiple="multiple" name="paintings">
<option value="The Persistance of Memory" selected="selected">The Persistance of Memory</option>
<option value="The Great Masturbator" selected="selected">The Great Masturbator</option>
<option value="The Scream">The Scream</option>
</select>
</td>
<td>
<select name="painters">
<option value="VanGogh" selected="selected">Van Gogh</option>
<option value="Dali">Dali</option>
<option value="Munch">Munch</option>
</select>
</td>
<td>
<a href="#">Save</a>
</td>

当用户点击保存时，选择的值应该存储在一个变量中。 这是我迄今为止尝试过的；

$("a").click( function (e){
    str = $(this).find("select[name|='painters']").val() || [];
    alert(str.join(","));

除了“find”，我还尝试了“parent”、“prev”和“closest”。 我也尝试将选择器指定为“select option:selected”。

这适用于获取 所有 元素或仅获取一个元素，但是当我试图找到最接近的两个并将其存储在两个不同的变量中时，它将不起作用。

非常感谢任何建议或帮助。谢谢。

Answer 1

您可以使用.map() 来获取一组值：（您的不工作，因为find() 向下遍历 DOM 树，因为您需要返回到 tr，然后是 @987654326 @从那里）

$("a").click( function (e) {
    var selectValues = $(this).closest("tr").find("select").map(function() {
        return this.value;
    }).get();
});

给你一个小提琴！ http://jsfiddle.net/5tLxk/

编辑：由于您有一个multi-select，您可以在其中嵌套另一个map 以获取所有值（小提琴：http://jsfiddle.net/5tLxk/1/）

$("a").click( function (e) {
    var selectValues = $(this).closest("tr").find("select").map(function() {
        return $(this).find("option:selected").map(function() {
            return this.value;
        }).get();
    }).get();

    console.log(selectValues);
});