我有以下带有 Jquery 排序的 html 代码
<div class="sortable" style='width:700px; margin: 0 auto; border:2px solid; border-color:grey;'>
<a href='#' class='expand'> Group 1</a>
<ul style="display:none" class="sortable" >
<li class="ui-state-default">Item 1</li>
<li class="ui-state-default">Item 2</li>
<li class="ui-state-default">Item 3</li>
</ul>
<a href='#' class='expand'> Group 2</a>
<ul style="display:none" class="sortable">
<li class="ui-state-default">Item 4</li>
<li class="ui-state-default">Item 5</li>
<li class="ui-state-default">Item 6</li>
</ul>
</div>
查询......
<script>
$(function() {
$( ".sortable" ).sortable();
$( ".sortable" ).disableSelection();
});
</script>
<script>
$(document).ready(function() {
$('.expand').click(function() {
$(this).next().toggle('slow', function() {
});
});
});
</script>
ul 内的列表是可排序的,整个 aer 上的 div 内的 uls 也是可排序的。问题是当我将一个项目从一个组移动到另一个时,如果我将该项目放在该组的项目之间,它会添加到 ul 中,但如果我将它放在组的底部或组的正下方,那么它是放置在 ul 之外。
编辑
现在我可以对每个 ul 中的列表进行排序,但我不能对整个 ul 进行排序,也不能将一个项目从一个组移动到另一个组
谁能帮我?谢谢