javascript - 如何使用动态 jQuery 输入创建数组？

Question

我有一个带有动态输入的表单。输入具有相同的名称属性。所以我想为每一行制作数组。

像这样；

[{'company':'Apple'},{'address':'USA'}],
[{'company':'Samsung'},{'address':'Korea'}]

我正在使用这个简单的表单(它是动态的)；

<form id='companies'>
  <input name='company[]'>
  <input name='address[]'>
</form>

还有这个；

$('form').submit(function(event) {
   var newFormData = $('#companies').serializeArray();
      console.log(newFormData);
   event.preventDefault();
 });

控制台日志； (同一数组中的所有输入)

[{'company':'Apple'},{'address':'USA'},{'company':'Samsung'},{'address':'Korea'}]

Answer 1

这是您的问题的解决方案示例:)

<form id='companies'>
  <div class='container-input'> 
     <input name='company[]'>
     <input name='address[]'>
  </div>
  <div class='container-input'> 
     <input name='company[]'>
     <input name='address[]'>
  </div>
  ... -> Now you have dynamic containers
</form>

您可以使用这种方法来解决 jQuery 的问题。

$('#companies').submit(function(event) {
    var $data = [];

    var $containers = $(".container-input");

    $containers.each(function() {
        var $contenedor = $(this);
        var $inputCompany = $contenedor.find('input[name^="company"]');
        var $inputAddress = $contenedor.find('input[name^="address"]');

        var $objectInput = [{
            'company': $inputCompany.val()
        }, {
            'address': $inputAddress.val()
        }];

        $data.push($objectInput);

    });

    console.log($data);

});