发布许多输入关系值 - jQuery

Question

我有一个用户可以为其添加输入的表单。所以他们可以添加他们想要的那么多输入。 每次他们点击“添加新”按钮时，都会发生这种情况：

$('#add_specification').on('click', function(){
        var new_item = '<input type="text" class="specification_title" title="TITLE" /> : <input type="text" class="specification_desc" title="DESCRIPTION" /> ';
        $('#specifications_inputs_holder').append(new_item);
    });

正如您在上面的代码中看到的那样，每次点击2新的输入都将添加到表单中，第一个用于标题，第二个用于描述，现在想象用户点击了“添加新” “按钮3次，所以我们有6个输入框：

现在我想提交表单，我希望整个值可以像：

一样发送

var specifications = ('Title 1=>Description 1','Title 2=>Description 2','Title 3=>Description 3');

所以在服务方面，我仍然可以看到相关的数据，我怎么能实现这个目标？

我认为我应该做的是使用jQuery each（）和数组：

$('#specifications_inputs_holder input').each(function(count){
    specifications[count] = $(this).val();
});

但这不是一个好的解决方案，任何人都可以帮助我吗？ 感谢

Answer 1

在jQuery中：

var spec = [];
$('.specification_title').each(function() {
  var index = $(this).attr('data-index');

  $(spec).push({$(this).val():$('.specification_desc[data-index='+index).val()});

});

在你的添加项目功能中：

var new_item = '<input type="text" data-index='+parseint($('.specification_title').length+1)+' class="specification_title" title="TITLE" /> : <input type="text" data-index='+parseint($('.specification_title').length+1)+' class="specification_desc" title="DESCRIPTION" /> ';

如果您只能删除最后一项，这将有效（对于数据索引）。否则，请使用增量全局变量。

[编辑]

然后更改输入名称以与内容同步，以检索良好的数组...更快！

$('input[class^="specification"').change(function() {
  $(this).attr('name', $(this).val());
});

Answer 2

您可以使用简单的for循环通过XML获取所有键/值对并将它们推送到数组：

var $title = $('.specification_title'),
    $desc =- $('.specification_desc'),
    arr = [];

for(var i=0;i<$title.length;i++){
    var key = $title.eq(i).val(),
        val = $desc.eq(i).val(),
        pair = {key:val};
    arr.push(pair);
}

现在你有一个类似的数组：

[{title1:desc1},{title2:desc2},...,{titleX:descX}]

在PHP方面，您只需使用输入的密钥即可。