使用JQuery对列表项进行排序

我已经看到了很多关于这个话题的问题，但是我找不到适合我需要的东西

下面是一个工作历史的例子，我需要按照正确的顺序排列（下面是正确的顺序）

我有5个列表项，它们基本上都是一样的，唯一的区别是不是StartMonth 1和StartYear 1，而是StartMonth 2和StartYear 2等

前端方面，它似乎在创建新的列表项，而不是对现有列表项进行排序。我是不是遗漏了什么

编辑2

我解决了我的问题（愚蠢的我！！）我将把上面的代码作为“记录”留给任何遇到相同问题的人

它实际上并没有重新创建列表，而是在我的页面上拾取所有列表（我有2个），并同时更新这两个列表（用这个排序的列表覆盖我的其他列表）。下面是我的代码（我使用了类名）：

通过这种方式，它对特定列表（基于类名）进行排序，而不是对所有列表进行排序

---

谢谢大家的帮助

请通过添加数据属性来尝试您的代码。您可以在

的数据属性中添加年/月值，这有助于排序。

使用以下功能：

$("li").sort(function(a, b) {
  return new Date($(a).attr("data-date")) > new Date($(b).attr("data-date"));
}).each(function() {
  $("ul").prepend(this);
});

通过日期构造函数按自定义属性对列表项进行排序（在本例中，我只是将其称为

data-date

）

完成此操作后，在将它们放回无序列表的同时对它们进行迭代

---

为每个

元素添加一个数据属性，并使用起始月的datetime字符串对值进行排序。因此，与第二个列表中的范围重叠无关，您希望基本上忽略“到”日期吗？如果你得到两个相等的“开始”日期呢？@dommm-这其实是个不错的主意。让我调查一下，看能不能让它工作。我会让你知道的。nnnnnnnn-在一个完美的世界中，我喜欢满足所有场景，但目前仅限于第一个月和第一年。@nnnnnnnn如果您愿意，您也可以添加第二个（嵌套）数据属性和排序函数来满足类似的值！谢谢@多姆早些时候也提出了同样的建议，我将对此进行研究。感谢您的回复。感谢您提供示例代码，这非常有帮助。我会回复你的。如果你颠倒排序顺序，你就不需要

.each（）

循环，你只需要

.prependTo（“ul”）

在一行中将它们重新插入到实际的DOM中。我试过你的代码，但似乎不正确。我已经用我尝试过的更新了我的问题，请让我知道我遗漏了什么…我解决了我的问题！我用答案更新我的问题。这是因为我的一个页面上有两个列表，并且两个列表都在更新，而不是我想要的特定列表。我使用类名指定要更新的列表。谢谢你的帮助！

<ul class="listitems">
    <li>March 2016 - Current</li>
    <li>October 2010 - February 2016</li>
    <li>January 2012 - September 2012</li>
    <li>October 2008 - December 2009</li>
</ul>

<li id="employment_summaryitem1" class="list-group-item row" style="display:none">
                    <div class="col-xs-8">
                        <span id="employment_summary_text1"></span>
                    </div>
                    <div class="col-xs-offset-4">
                        <button id="btnDelete_employment_summary1" type="button" class="btn btn-xxs btn-danger pull-right glyphicon glyphicon-remove" style="font-size:x-small;position:relative"></button>
                        <button id="btnEdit_employment_summary1" type="button" class="btn btn-xxs btn-primary pull-right glyphicon glyphicon-pencil" style="font-size:x-small;margin-right:2px;position:relative"></button>
                    </div>
</li>

var StartMonth1 = $('#ddljobstartmonth').val();
var StartYear1 = $('#ddlstartyear').val();

$('#employment_summaryitem1').attr('data-date', StartMonth1 + ' ' + StartYear1);

$("li").sort(function (a, b) {
            return new Date($(a).attr("data-date")) > new Date($(b).attr("data-date"));
        }).each(function () {
            $("ul").prepend(this);
        });

    $(".list-group-item").sort(function (a, b) {
        return new Date($(a).attr("data-date")) > new Date($(b).attr("data-date"));
    }).each(function () {
        $(".list-group").prepend(this);
    })

$("li").sort(function(a, b) {
  return new Date($(a).attr("data-date")) > new Date($(b).attr("data-date"));
}).each(function() {
  $("ul").prepend(this);
});