javascript - 如何在 jQuery 中的每个循环中将数据插入数组中

Question

从过去的 5 个小时开始，我一直在尝试解决一件事，我认为几乎成功了，但由于没有得到我想要的结果而卡在某个地方。我想在这里我需要一些专家级的帮助来纠正我做错的地方。

var eduarray = [];
$('.education-groupbox').each(function(index, el) {
    eduarray[index] = [];   
    var s = $(this).attr('id');
    //console.log();
    $('#'+s+' .inputs').each(function(key, value) {

        //eduarray['index'].push("rohit");

    });

});

我想要得到的是每个循环中具有多个数组的对象格式的结果，以便我可以通过 formdata 发送数据并处理 php 表单。

 <div id="education-groupboxwrapper">
                    <div id="education-groupbox" class="education-groupbox">
                      <div class="inputs col-3">
                        <label for="email">Bölüm</label>
                        <input type="text" name="email" />
                      </div>
                      <div class="inputs col-3">
                        <label for="email">Okul Adı</label>
                        <input type="text" name="email" />
                      </div>
                      <div class="inputs col-3">
                        <label for="email">Bölüm</label>
                        <input type="text" name="email" />
                      </div>
                      <div class="inputs col-3">
                        <label for="email">Bölüm</label>
                        <input type="text" name="email" />
                      </div>
                    </div> 
                  </div>

Answer 1

我从你的代码中发现了一些错误，$('#'+s+' inputs').each将不起作用，因为 ID 是唯一的，请改用类，这样您可以在具有相同类名的同一输入组下有多个输入。

使用 eduarray[index].push($(this).val());将值插入数组。

$('.education-groupbox').each将遍历 <div class="education-groupbox"> 的每个 HTML block 因此在每个内部使用 $(this).find('input')将返回此 block 内的所有输入，然后您可以使用 each 将所有输入值推送到数组。

var eduarray = [];
$('.education-groupbox').each(function(index, el) {
  var _this = $(this);
  eduarray[index] = [];
  _this.find('input').each(function(key, v) {
    eduarray[index].push(v.value);
  });

});

console.log('eduarray[0] -->' + eduarray[0]);
console.log('eduarray[1] -->' + eduarray[1]);
console.log('eduarray    -->' + eduarray);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="education-groupboxwrapper">
  <!-- groupbox 1 -->
  <div class="education-groupbox">
    <div class="inputs col-3">
      <label for="email">Bölüm</label>
      <input type="text" name="email" value="test1" />
    </div>
    <div class="inputs col-3">
      <label for="email">Okul Adı</label>
      <input type="text" name="email" value="test2" />
    </div>
    <div class="inputs col-3">
      <label for="email">Bölüm</label>
      <input type="text" name="email" value="test3" />
    </div>
    <div class="inputs col-3">
      <label for="email">Bölüm</label>
      <input type="text" name="email" value="test4" />
    </div>
  </div>
  <!-- groupbox 2 -->
  <div class="education-groupbox">
    <div class="inputs col-3">
      <label for="email">Bölüm</label>
      <input type="text" name="email" value="test111" />
    </div>
    <div class="inputs col-3">
      <label for="email">Okul Adı</label>
      <input type="text" name="email" value="test222" />
    </div>
    <div class="inputs col-3">
      <label for="email">Bölüm</label>
      <input type="text" name="email" value="test333" />
    </div>
    <div class="inputs col-3">
      <label for="email">Bölüm</label>
      <input type="text" name="email" value="test444" />
    </div>
  </div>
</div>