Question

我有一个可排序的列表（jQuery UI）格式如下：

<ul class="baseList">
    <li id="3">Item 1
        <ul class="childList">
            <li id="68">Child 1 of Item 1</li>
            <li id="69">Child 2 of Item 1</li>
            <li id="70">Child 3 of Item 1</li>
        </ul>   
    </li>
    <li id="8">Item 2
        <ul class="childList">
            <li id="81">Child 1 of Item 2</li>
            <li id="83">Child 2 of Item 2</li>
        </ul> 
    </li>
</ul>

我想要实现的是获取一个由以下内容组成的数组变量：

var entireList = []; entireList = [[3,[68, 69, 70], 8, [81, 83]]]

所以我可以将该变量发布到PHP以在数据库中处理它。

我似乎无法弄清楚如何在javascript中解决这个问题。到目前为止我所拥有的是：

var childList = $('.childList, .baseList').sortable({
        placeholder: "ui-state-highlight",
        opacity: 0.6,
        update: function(event, ui){
            var childArray = $('.childList').sortable('toArray');
            var parentsArray = $('.baseList').sortable('toArray');
            for(p in parentsArray)
            {
                postChildData[parentsArray[p]] = childArray;
            }
            console.log(postChildData);
        }
    });

现在适用于减半，我的结果是： [3: Array[3], 8: Array[3]] 归结为它只需要第一个<li>元素的孩子。

有人可以帮助我得到一个像我上面写的那样的数组（wholeList）吗？

Answer 1

它可能不是正确的CSS，但给第二个列表一个不同的类名，我在这个例子中给了它childList2。如果你不想修改ul，那么你可以将一个级别上升到父级别

    var childArray = [];
    var childArray2 = [];

    $.each(childList, function(children) {
       childArray.push(children);
    });
    $.each(childList2, function(children2) {
       childArray2.push(children2);
     });

如果这不起作用，我应该停止猜测而无法自己测试它。你

Answer 2

不要在for循环中使用childArray，而是使用它：

$('#' + parentsArray[p] + ' > ul').sortable('toArray');

Answer 3

好的，我终于找到了解决方案：我需要创建一个新的数组，在那里我需要存储父ID以及带有子项的数组。

执行此操作的方法是使用以下内容替换for循环：

for(p in parentsArray)
{
   postListData[p] = Array(parentsArray[p], $('#' + parentsArray[p] + ' > ul').sortable('toArray'));
}

jQuery Sortable：将值存储在多维数组中

3 个答案: