Question

我有这个列表，可以使用sortable进行排序。在排序完成后，如何将带有.neutral的li项目移动到列表的末尾？

$(".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>

Answer 1

您可以使用.appendTo()将它们附加（移动）到列表的末尾，如下所示：

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

You can give it a try here，这会获取内部的所有.neutral元素并将其附加到我们当前所在的this ul.thumbs，这将适用于多个独立列表还有缩略图。

Answer 2

等价物如下：

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

您可以通过选择元素并在其他地方附加或添加元素来移动页面周围的元素。

注意：注意范围 - 如果您正在使用类并且此UI在页面上多次出现，则需要使用传递给stop函数的ui参数将上述selctors范围限定为当前实例

jQuery将列表项移动到列表末尾

2 个答案: