对多种类型的表单元素使用jQuery map（）

我正在构建一个多步骤的联系人表单（每个步骤都在一个文章标记中），我正在使用jQuery

map（）

将标签和输入值存储到一个数组中，然后在表单的最后一部分显示信息。存储数组的jQuery如下所示：

$("article:last").prev().find("a.next").on("click", function(){
    var arr = $('.form-item').map(function() {
        var lab = $('label', this).text();
        var val = $('input', this).val();
        return "<li>" + lab + " " + val + "</li>";
    }).get()

    $("article:last ul#results").append(arr.join(''))
});

$（“article:last”）.prev（）.find（“a.next”）.on（“click”，function（））{
var arr=$（'.form item'）.map（函数（）{
var lab=$（'label'，this）.text（）；
var val=$（'input'，this.val（）；
返回“
”+lab+“+val+”
”；
}).get（）
$（“文章：最后一次ul#结果”）.append（arr.join（“”））
});

这非常有效，但是对于文本区域和选择菜单返回“未定义”，这是正确的。我需要调整此代码以适用于选定的项目和文本区域。我的HTML非常简单，如下所示：

<article>
<div class="form-item">
    <label>Address:</label>
    <input type="text" />
</div>

<div class="form-item">
    <label>Message:</label>
    <textarea rows="2" cols="20"></textarea>
</div>
</article>

地址:
信息：

每一篇文章都代表了表单的一个新部分。所以问题是，如何调整jQuery以支持其他表单元素？如果有条件地说，“如果

.form item

的子项包含一个textarea，请运行此代码……等等，

您可以使用

:eq（）

选择器，

eq（1）

选择div标记的第二个子项、输入或textarea元素

var arr = $('.form-item').map(function() {
    var lab = $('label', this).text();
    var val = $(':eq(1)', this).val();
    return "<li>" + lab + " " + val + "</li>";
}).get()

var arr=$（'.form item'）.map（函数（）{
var lab=$（'label'，this）.text（）；
var val=$（'：eq（1'），this.val（）；
返回“
”+lab+“+val+”
”；
}).get（）

---

您可以这样写：

​var arr = $('.form-item').map(function() {
    var val = $(this).find('input, textarea').val();
    return val;
}).get();​​​​​​​​​​​

---

我可以在那里使用selects和radio吗？比如：var val=$（this）。查找（'input，textarea，select，radio'）。val（）；而不是：eq（1）你也可以使用（，）比如：'input，textarea，select'或者只使用（：input）：这更能表达你的意图。