数组的DOM结构

Question

我正在做“菜单设计器”--一个在应用后端编辑菜单结构的工具。我有这样的html代码

<ul id="menu-designer-control">
    <li id="mi-2">
        <h3>Submenu header</h3>     
        <ul>
            <li id="mi-4"><h4>Hello world - article</h4></li>

            <li><!-- Drop here --></li>
        </ul>
    </li>
    <li id="mi-1">
        <h3>Hello world - article</h3>      
        <ul>
            <li><!-- Drop here --></li>
        </ul>
    </li>

</ul>

我想在PHP中得到这样的数组。

array(    
    2 /* top level item id */ => array( 4 /* children id */ ), 
    1 => array() /* or null or whatever */    
);

你能给我个建议怎么做吗？我已经尝试过.sortable( 'serialize );，我已经尝试使用each (在所有的li-s上)，但没有成功--而且我不太熟悉javascript数组:- /(所以我不太确定它应该是什么样子，以及如何将它作为JSON对象/字符串发送到服务器…？)

非常感谢

(我使用的是jQuery。)

Answer 1

function children(ul) {
  var lis = ul.children(), obj = {};
  lis.each(function(i, li) {
    var id = $(li).attr('id').substr(3);
    if ( id ) {
      obj[id] = children($('> ul', li));
    }
  });
  return obj;
}

var obj = children($('ul#menu-designer-control'));
console.log(obj);

如果只有2层LI存在，第二层对象将总是空的(这没问题)。它的构建是递归的:3层，4层等等，没有问题。

编辑

稍微调整了一下：http://jsfiddle.net/rudiedirkx/xhLwF/

编辑

Chrome 10的结果：

Object
  1: Object (empty)
  2: Object >
    4: Object (empty)

编辑

经过强化的JSON结果：

{"1": {}, "2": {"4": {}}}

Answer 2

您必须使用对象来执行此操作：

var dom = {
   "2":[4]
   ,
   "1":[]
};

我不确定这是否是你问题的答案:)