如何使用jQuery作为数组获取输入字段的多维数组

Abuzer Firdousi 发表于 Dev

Abuzer Firdousi

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>

血腥的指关节

使用函数递归进行深度挖掘以收集嵌套的输入元素，并在维护嵌套结构的过程中返回数组：

$(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/

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。