1

所以我有一个这样的表格:

<form>
  <input name="name" value="A. Hitchcock">
  <input name="email" value="a.hitchcock@psychose.com">
  <input name="name" value="Q. Tarantino">
  <input name="email" value="q.tarantino@killbill.com">
  ...
</form>

很简单的一个。它使我能够从我的客户那里获得name和获得。email使用 jQuery,我有一个按钮可以让我将更多客户 (nameemail) 添加到我的表单中。

我需要在每次表单更改时回显这些数据,所以我使用了以下代码:

$('.form-horizontal').on('change','input', function(){
  var dataArray = $('#list-items').serializeArray();
});

serializeArray()我可以将所有数据序列化为一个数组。

我的问题是这样显示这些数据serializeArray()

  • A. Hitchcock有这个电子邮件地址:a.hitchcock@psychose.com
  • Q. Tarantino有这个电子邮件地址:q.tarantino@killbill.com

请问如何做到这一点的任何帮助?

4

2 回答 2

1

建议您将这些对包装在父级中并使用 serializeArray() 忽略

<form>
    <div class="person">
        <input name="name[]" value="A. Hitchcock">
        <input name="email[]" value="a.hitchcock@psychose.com">
    </div>
    <div class="person">
        <input name="name[]" value="Q. Tarantino">
        <input name="email[]" value="q.tarantino@killbill.com">
    </div>
</form>

然后映射组中的值:

var res = $('.person').map(function () {
    var $inputs = $(this).find('input');
    return '<li>' + $inputs.eq(0).val() + ' has this email address :' + $inputs.eq(1).val() + '</li>'
}).get();

$('#list').append(res.join(''));

DEMO

serializeArray() 创建的对象如下所示:

[{
    "name": "name[]",
    "value": "A. Hitchcock"
}, {
    "name": "email[]",
    "value": "a.hitchcock@psychose.com"
}, {
    "name": "name[]",
    "value": "Q. Tarantino"
}, {
    "name": "email[]",
    "value": "q.tarantino@killbill.com"
}]

所以解析这些仍然需要配对索引来获取名称和电子邮件

如果你真的想这样做,你可以使用for循环:

var res= [];
for( var i=0; i< arr.length; i=i+2){
     res.push('<li>' + arr[i].value + ' has this email address :' + arr[i+1].value + '</li>');
}
于 2015-07-25T23:20:56.430 回答
1

在不更改 HTML 代码中的任何内容的情况下,您可以像下面的代码一样将namesemails分成两部分,然后在简单的循环中将它们连接起来:Arraysfor

完整的JS:

$('.form-horizontal').on('change','input', function(){  
    var names = $("form input[name='name']").serializeArray();
    var emails = $("form input[name='email']").serializeArray();

    for(var i=0;i<=names.length;i++){
        alert(names[i].value+" has this email address : "+emails[i].value);
    }
});

希望对您有所帮助。

于 2015-07-25T23:24:43.110 回答