jQuery UI的排序禁用问题

Question

我有一个嵌套的排序列表：

<ul class="testSortable"> 
    <li class="ui-state-default" rel="1">What Can I Say? 
     <ul class="testSortable" rel="1"> 
      <li class="ui-state-default" rel="4">Total Divisions 
      <ul class="testSortable" rel="4"></ul> 
      </li> 
     </ul> 
    </li> 
</ul> 

我想使它这样UI排序可以拖动整个列表下降，问题是使它因此它不能下降到一个子元素并导致整个节点消失。

我当前的代码是：

$('.testSortable').sortable({ 
axis:  'y', 
cursor:  'move', 
connectWith: '.testSortable', 
placeholder: 'ui-state-highlight',   
start: function(evt, ui){ 
    $(ui.item).children(".testSortable").sortable('disable'); 
}, 
stop: function(evt, ui){ 
    $(ui.item).children(".testSortable").sortable('enable'); 
} 
}); 

这似乎使在子元素中显示为禁用类，但实际上并没有禁止任何东西，所以占位符是不透明的，但你可能仍然下降到子元素。

有什么建议吗？

Answer 1

在寻找一种方法来实际禁用节点而没有成功之后，我想出了一个解决方法。

start: function(evt, ui){ 
    $(".testSortable", ui.item).hide();    
}, 
stop: function(evt, ui){ 
    $(".testSortable", ui.item).show();    
} 

主要是隐藏子节点，直到排序的选项移动到其最终位置。