Javascript:循环遍历类并推送输入

Question

我在将某些输入值推送到 array 时遇到问题。我有一个div与类(class)optiondiv可以克隆。该 div 有一些表行和一些输入字段，如下所示:

<div class="optiondiv">
    <table class="tableOptions">
        <tr>
            <td>
                <input type="text" class="title">
            </td>

            <td>
                <input type="text" class="position">
            </td>
            <td>
                <select class="input">
                    <option value="1">Drop-down</option>
                    <option value="2">Radio Buttons</option>
                    <option value="3">Checkbox</option>
                    <option value="4">Multiple Select</option>
                </select>
            </td>
            <td>
                <input type="checkbox" class="required"> Required?
            </td>
        </tr>
        </tbody>
    </table>
</div>

我试图获取每个选项的选项的所有输入字段，然后将它们推送到数组中。问题是每个选项之间没有“分割”。如果我使用 console.log(); ，值将像这样打印:[Doors, 1, Windows, 5]但我真正想要的是

[0][Doors, 1]
[1][Windows, 5]

这是我正在使用的代码:

$('.generateString').click(function (e)
    {
        e.preventDefault();
        $('.optiondiv').each(function(){
            var arrText = new Array();

            $('input[type=text]').each(function ()
            {
               if($(this).val() != ''){
                   // arrText.push('nietleeg');
                   arrText.push($(this).val());
                }
            })
            console.log(arrText);
        })

    });

祝你编码愉快!

Answer 1

首先，而不是

$('input[type=text]').each(function ()

您需要使用它来获取每个 .optiondiv 内的输入元素

$(this).find('input[type=text]').each(function ()

根据您的要求，只需在外部定义数组变量并在每个循环内创建关联数组，如下所示

$('.generateString').click(function(e) {
    e.preventDefault();
    var arrText = new Array();
    $('.optiondiv').each(function(i) {
        if (typeof arrText[i] == "undefined")
            arrText[i] = new Array();

        $(this).find('input[type=text]').each(function() {
            if ($(this).val() != '') {
                // arrText.push('nietleeg');
                arrText[i].push($(this).val());
            }
        })
        console.log(arrText[i]);
    })

    console.log(arrText);

});