Как получить многомерный массив входных полей с jQuery как массив

Question

jQuery find() и children() дают массив всех критериев соответствия. Массив одномерный. Но мне нужно создать многомерный массив, чтобы иметь входные данные в дочернем контейнере.

Просто нужно немного подсказки, как я могу достичь этого эффективно, а не зацикливать детей и генерировать многомерный массив.

$(document).ready(function() { 
 
    var inputs = $('.container .box').find('input'); 
 
    // var inputs = $('.container .box :input') 
 
    console.log(inputs); 
 
    /* This will result as follow, 
 
     [ 
 
      0: input.tag_name 
 
      1: input.tag_name 
 
      2: input.tag_name 
 
      3: input.tag_name 
 
      4: input.tag_name 
 
     ] 
 
     But i need the following nested array 
 
     [ 
 
      0: input.tag_name 
 
      1: input.tag_name 
 
       [ 
 
       2: input.tag_name 
 
        [ 
 
        3: input.tag_name    
 
        ] 
 
       ] 
 
      4: input.tag_name 
 

 
     ] 
 
    */ 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<div class="container"> 
 
    <div class="row box"> 
 
     <input type="text=" value="1" class="tag_name" /> 
 
    </div> 
 
    <div class="row box"> 
 
     <input type="text=" value="2" class="tag_name" /> 
 
     <div class="box"> 
 
      <input type="text=" value="2.1" class="tag_name" /> 
 
      <div class="box"> 
 
       <input type="text=" value="2.1.1" class="tag_name" /> 
 
      </div> 
 
     </div> 
 
    </div> 
 
     <div class="row box"> 
 
     <input type="text=" value="3" class="tag_name" /> 
 
    </div> 
 
</div>

Answer 1

Используя функцию рекурсии, чтобы копать так глубоко, как это необходимо, чтобы собрать вложенные элементы ввода и возвращения массивов по пути, чтобы поддерживать вложенную структуру:

$(document).ready(function() { 
    function boxindexes(self) { 
     var bi = []; 
     bi.push(self.children('input')[0]); 
     self.children('.box').each(function(){ 
      bi.push(boxindexes($(this))); 
     }); 
     return bi; 
    } 
    var inputs = []; 
    $('.container').children('.box').each(function() { 
     inputs.push(boxindexes($(this))); 
    }); 
    console.log(inputs); 
}); 

Выходы:

[ 
    0: [0: input.tag_name], 
    1: [ 
     0: input.tag_name, 
     1: [ 
      0: input.tag_name, 
      1: [0: input.tag_name] 
      ] 
    ], 
    2: [0 input.tag_name] 
] 

Посмотрите сами: http://jsfiddle.net/BloodyKnuckles/a0j0xyun/