2010-09-28 70 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参数将上述选择器的作用域限定为当前实例。