jquery ui可排序的父元素和子元素

Question

我想有所有的选项来将父子元素作为子元素。

后来孩子应该是父母，如果作为父母拖动并且能够获取子元素。

这是可能的，如何解决它？

这是我的本钱： http://jsfiddle.net/LBybN/

<script type="text/javascript"> 
    $(function () { 
     $('ul.nav').sortable({ 
      connectWith: '.subnav', 
     }); 
     $('ul.subnav').sortable({ 
     connectWith: '.nav', 
     }); 
    }) 
</script> 

<ul class="nav"> 
    <li>Web Development</li> 
    <ul class="subnav"> 
     <li>PHP Jobs</li> 
     <li>OSCommerce projects</li> 
    </ul> 
    <li>Content Creation</li> 
    <ul class="subnav"> 
     <li>Technical Writing Jobs</li> 
     <li>Forum Posting</li> 
    </ul> 
    <li>Design and Artwork</li> 
    <ul class="subnav"> 
     <li>Blog Design Projects</li> 
     <li>Freelance Website Design</li> 
    </ul> 
    <li>Sales and Marketing</li> 
    <ul class="subnav"> 
     <li>Internet Marketing Consulting</li> 
     <li>Leads Generation Services</li> 
    </ul> 
    <li>Test</li> 
    <ul class="subnav"></ul> 
</ul> 

<style> 
.subnav { 
    background-color:orange; 
    min-height:10px; 
    width:400px; 
} 
</style> 

感谢所有帮助。

Answer 1

希望这对你来说不算太晚。 你应该尝试建立每个子节点

<li> 
    <h2>Level 1_2</h2> 
    <ul class="nav"></ul> 
</li> 

，并更改了jQuery：

$(document).ready(function() { 
    $(".nav").sortable({ 
     connectWith: ".nav" 
    }).disableSelection(); 
}); 

Here is a jsFiddler with a small example。