2010-09-28 26 views
10

我有這個列表,可以排序排序。 如何在排序完成後將.neutral類的li項目移動到列表的末尾?jQuery移動列表項到列表結尾

$(".thumbs").sortable({ 
    stop: function(event, ui) { 
     // move .neutral at the end of this list 
    } 
}); 

<ul class="thumbs"> 
    <li>red</li> 
    <li>green</li> 
    <li class="neutral">none</li> 
    <li>yellow</li> 
    <li>blue</li> 
<ul> 

回答

8

您可以附加(移動)他們到列表的末尾用.appendTo(),像這樣:

$(".thumbs").sortable({ 
    stop: function(event, ui) { 
     $(this).find('.neutral').appendTo(this); 
    } 
}); 

You can give it a try here,這得到裏面的所有.neutral元素,並將它們追加到this這是我們目前處於ul.thumbs,這也適用於多個獨立縮略圖列表。

+0

hi Nick。其實我正在嘗試一些可拖拽和排序的東西,所以不會爲我做。可以看看http://jsfiddle.net/Y2ER7/它基於jquery.ui.droppable購物車示例。 (我需要找到一種方法從拇指中獲取src以及btw) – FFish 2010-09-28 15:02:05

3

相當於是以下幾點:

$(".neutral").appendTo(".thumbs"); 
OR 
$(".thumbs").append(".neutral"); 

您可以通過選擇和追加或其他地方的前面加上一個頁面中移動的元素。

注意:請注意範圍 - 如果您使用的是類,並且此UI在頁面上出現多次,則需要使用傳遞給stop函數的ui參數將上述選擇器的作用域限定爲當前實例。