嵌套jQuery sortables的问题

Question

这是我的页面的基本HTML结构:

<div id="selectedItemsTop">
    <ul>
        <li>
            Root element
            <ul>
                <li>Level One a</li>
                <li>Level One b</li>
                <li>
                    Level One parent
                    <ul>
                        <li>Level Two a</li>
                        <li>
                            Level Two parent
                            <ul>
                                <li>Level Three a</li>
                                <li>Level Three b</li>
                            </ul>
                        </li>
                        <li>Level Two b</li>
                    </ul>
                </li>
                <li>Level One c</li>
            </ul>
        </li>
    </ul>
</div>

例如:

• 根元素
  • 一级a
  • 一级b
  • 一级父母
    • 二级a
    • 二级父母
      • 三级a
      • 三级b
    • 二级b
  • 一级c

在每个缩进级别可以有超过根的任意数量的项目,但是每个级别只有3个级别,并且每个级别只有一个父级(即:<ul>根目录下总是正好3 秒,但是<li>s 的数量是可变的) .

我允许用户使用jQuery UI Sortable插件重新排序此结构.要添加新项目,有三组项目(第一级项目,第二级项目,第3级项目),它们位于此树的页面上.用户可以从那里拖动到列表中来添加它 - 但必须在相应级别添加它.

我有这个工作已经在使用draggable与该connectToSortable选项:

$('ul.availableItems').each(function(i) {
    var selector = "#selectedItemsTop > ul";
    for (var j = 0; j <= i; ++j) { // count from 0 to [0, 1, 2]
        selector += " > li > ul";
    }
    // eg: selector == "#selectedItemsTop > ul > li > ul"
    // eg: selector == "#selectedItemsTop > ul > li > ul > li > ul"
    // eg: selector == "#selectedItemsTop > ul > li > ul > li > ul > li > ul"
    $(this)
        .find('li')
        .draggable({
            connectToSortable : selector
        })
    ;
});
$('#selectedFieldsTop > ul > li ul').sortable();

正如我所说,这适用于除了IE以外的一切.一级物品可以完美地工作,但是不会将2级或3级物品添加到可分类物品中.尝试对已经存在的2级或3级项目中的一项进行排序,使其获得整个"一级父级"项目并移动整个项目.

有什么你能想到的可以使这个工作在Firefox而不是IE吗？你能想到一个不同的方法来处理这个问题吗？

_{版本:Firefox 3.6,IE7,jQuery 1.3.2,jQuery UI 1.7.2}

更新:
这是JSBin上的工作代码:http://jsbin.com/ixabo/edit - 不出所料,它在IE中不起作用,但我认为这是JSBin的问题("_console未定义").要看到它半工作,可能复制/粘贴到本地文件并在IE中打开它.

Answer 1

您可以使用其他插件吗？jsTree在这种事情上做得非常好。