0

我有一个表单，用户可以向其中添加输入。所以他们可以添加他们想要的任意数量的输入。每次他们单击“添加新”按钮时，都会发生这种情况：

$('#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();
});

但这听起来不是一个好的解决方案，有人可以帮助我吗？谢谢

4

2 回答 2

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());
});
于 2013-03-27T15:52:02.813 回答
1

您可以使用简单的 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 端，您可以只使用输入的键。

于 2013-03-27T15:59:28.683 回答