Question

我正在尝试使用TinySort将所有<li>项目置于列表顶部：

<ul class="team">
    <li><strong>Name 1</strong></li>
    <li><strong>Name 2</strong></li>
    <li class="sticky"><strong>Name 3</strong></li>
    <li><strong>Name 4</strong></li>
    <li class="sticky"><strong>Name 5</strong></li>
</ul>

我需要覆盖用PHP创建的列表的顺序。在页面加载时执行此操作的正确jQuery脚本是什么？

Answer 1

你可以采取多种方式;一种方法是将它们添加到自己的列表中：

$(".sticky").prependTo(".team");

小提琴：http://jsfiddle.net/jonathansampson/kUq4p/

Answer 2

您也可以执行此操作http://jsfiddle.net/DUZkp/1/

$(document).ready(function(){

    var $tempDiv = $('<div><div/>');

    $('.team li').each(function(){
        if(!$(this).hasClass('sticky')){
            $tempDiv.append($(this));
        }
    });

    $('.team li').each(function(){
        if($(this).hasClass('sticky')){
             $tempDiv.append($(this));
        }
    });

    $('.team').html($tempDiv.html());

});

TinySort <li>基于类</li>的项目

2 个答案: