javascript - 如何使用 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/