JQuery的排序小問題

我曾用jQuery下面的HTML代碼排序JQuery的排序小問題

<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>

JQuery的......

<script> 
    $(function() { 
     $(".sortable").sortable(); 
     $(".sortable").disableSelection(); 
    }); 
</script> 
<script> 
$(document).ready(function() { 
    $('.expand').click(function() { 
     $(this).next().toggle('slow', function() { 
     }); 
    }); 
}); 

</script>

內UL列表進行排序，並且在div裏面的ULS全空氣也可以排序。問題是，當我將一個項目從一個組移到另一個項目時，如果我將該項目放入該組的項目之間，它將被添加到ul中，但如果我將它放在組的底部或組的下方，那麼它就是放置在ul之外。

編輯

現在我可以每個UL內部列表進行排序，但我不能排序的整個UL，不能從一個組移動項目到另一個

任何一個能幫助我嗎？感謝

On JSFiddle

來源

2012-06-26 Zoha Ali Khan

請在[JSFiddle]（http://jsfiddle.net） – Hubro

上重新創建您的問題您擁有*三個元素，並且具有相同的'id'。在你修復之前，進一步的故障排除是沒有意義的。 – Jon

@Codemonkey這裏是鏈接http://jsfiddle.net/yDXfP/2/ –

你的腳本是瘋狂，因爲你有一大堆的項目具有相同的ID sortable - 僅使用每個元素的一個ID，多個元素可以共享相同的類。例如...

<script type="text/javascript"> 
    $(function() { 
     $(".patents").sortable(); 
     $(".patents").disableSelection(); 
    }); 
</script> 

<div id="sortWrap"> 

    <a href="#" class="expand">Group 1</a> 
    <ul style="display: none;" id="ulOne" class="patents"> 
     <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;" id="ulTwo" class="patents"> 
     <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>

除了你的語法錯誤，你正在試圖做的是不容易單獨可排序完成;你會希望這個擴展能夠重新排列嵌套列表：https://github.com/mjsarfatti/nestedSortable

來源

2012-06-26 20:47:21 65Fbef05

你可以看看我的編輯嗎？ –

我明白你現在想要做什麼。我已經用鏈接更新了我的答案。 – 65Fbef05

感謝您的非常好的鏈接，但我如何看到一些演示？ –

JQuery的排序小問題

回答

相關問題