Javascript 如何使用jquery对列表项进行排序

我已经做好了准备。但是没有找到好的解决办法。

var$lis=$（“li”）；
$（'#numBnt'）。在（'click'，函数（）{
var numericalyordereddivs=$lis.sort（函数（a，b）{
返回$（a.text（）>$（b.text（）；
});
$（“.class of ul”）.html（数字或数字）；
});








分类






要对以下列表进行排序，请使用脚本：

<script>
$(function () {
    $.fn.sortListItems = function () {
        debugger;
        var ul = $(this);
        var listitems = $('li', ul).get();
        listitems.sort(function (a, b) {
            var text1 = $(a).text().toLowerCase();
            var text2 = $(b).text().toLowerCase();
            if ($.isNumeric(text1) && $.isNumeric(text2)) {
                return (parseInt(text1) < parseInt(text2)) ? -1 : 1;
            }
            else { return (text1 < text2) ? -1 : 1; }

        });
        $.each(listitems, function (i, item) {
            ul.append(item);
        });
    }
    $(".class-of-ul").sortListItems();
});
</script>


$（函数（）{
$.fn.sortListItems=函数（）{
调试器；
var ul=$（本）；
var listitems=$（'li'，ul）.get（）；
排序（函数（a，b）{
var text1=$（a）.text（）.toLowerCase（）；
var text2=$（b）.text（）.toLowerCase（）；
如果（$.isNumeric（text1）和&$.isNumeric（text2））{
返回（parseInt（text1）
这些值来自数据库为什么不在html中插入它们时对它们进行排序？为什么要得到类名，您到底想按什么排序？同意上面的说法，如果这是一个数据库，为什么不先对它进行排序呢？你是想按类中包含的文本排序吗？还是通过实际元素的文本？65、66、67等等…我会使用
$（'ul'）.children（）
：。我们是否可以在就绪状态下运行它。不点击按钮？为什么不从
按钮中剪切代码？点击
并粘贴到
文档中。准备好了吗？
：）@Osmani如果它解决了您的问题，您可以将其标记为答案（也可以进行投票）
var $lis = $("li");

$('#numBnt').on('click', function () {
    var numericallyOrderedDivs = $lis.sort(function (a, b) {
        return $(a).text() > $(b).text();
    });
    $(".class-of-ul").html(numericallyOrderedDivs);
});  

<ul class="class-of-ul">
    <li class="first post-230 product type-product status-publish has-post-thumbnail product_cat-c-20-heating-ventilating-and-ac product_cat-california-online-practice-exams product_tag-pro-11 taxable shipping-taxable purchasable product-type-simple product-cat-c-20-heating-ventilating-and-ac product-cat-california-online-practice-exams product-tag-pro-11 instock"><a href="#">66</a></li>
    <li class="post-60 product type-product status-publish has-post-thumbnail product_cat-california-contractor-law-and-business-exam-study-materials product_cat-california-online-practice-exams product_tag-pro-1 taxable shipping-taxable purchasable product-type-simple product-cat-california-contractor-law-and-business-exam-study-materials product-cat-california-online-practice-exams product-tag-pro-1 instock"><a href="#">65</a></li>
    <li class="last post-258 product type-product status-publish has-post-thumbnail product_cat-c-33-painting-and-decorating product_cat-california-online-practice-exams product_tag-pro-14 taxable shipping-taxable purchasable product-type-simple product-cat-c-33-painting-and-decorating product-cat-california-online-practice-exams product-tag-pro-14 instock"><a href="#">68</a></li>
    <li class="first post-158 product type-product status-publish has-post-thumbnail product_cat-a-general-engineering product_cat-california-online-practice-exams product_tag-pro-3 taxable shipping-taxable purchasable product-type-simple product-cat-a-general-engineering product-cat-california-online-practice-exams product-tag-pro-3 instock"><a href="#">67</a></li>
</ul>

<script>
$(function () {
    $.fn.sortListItems = function () {
        debugger;
        var ul = $(this);
        var listitems = $('li', ul).get();
        listitems.sort(function (a, b) {
            var text1 = $(a).text().toLowerCase();
            var text2 = $(b).text().toLowerCase();
            if ($.isNumeric(text1) && $.isNumeric(text2)) {
                return (parseInt(text1) < parseInt(text2)) ? -1 : 1;
            }
            else { return (text1 < text2) ? -1 : 1; }

        });
        $.each(listitems, function (i, item) {
            ul.append(item);
        });
    }
    $(".class-of-ul").sortListItems();
});
</script>